28173 sujets

CSS et mise en forme, CSS3

Problème Affichage Tableau sous IE

Bonjour,

Je suis actuellement en train de faire un site PHP/MySQL/CSS.

Il se trouve que j'ai un petit souci avec mes tableaux sous IE que je n'ai pas sous Firefox (comme souvent d'ailleurs).

En fait, la hauteur de mes tableaux de la partie "encarts" (à droite) en CSS sont plus grands sous IE que sous Firefox (ce qui fait qu'ils ne sont plus alignés avec l'image de gauche).

Bref, voici mon code : 


<body>
<table id="index">
        <tr><td>
        <table id="page-index">
        <tr><td>
              <table id="images" cellpadding="1" cellspacing="1"><tr><td><table id="menu">
              <tr><td valign="bottom"><p>Menu</p></td><td align="right">Logo</td></tr></table><table>
              <tr><td>
                      <table id="bannieregauche-index" cellpadding="0" cellspacing="0"><tr><td>
                             <table id="bordure1" cellpadding="0" cellspacing="0"><tr><td>
                                    <table id="bordure2" cellpadding="0" cellspacing="0"><tr><td>
                                          <table id="principal" cellpadding="0" cellspacing="0"><tr><td>
                                           <script language="javascript">
                                           diapo1()
                                           </script>
                                           </td></tr></table>
                                    </td></tr></table>
                             </td></tr></table>
                      </td></tr></table>
               </td>
               <td>
               <table id = "encarts" cellpadding="0" cellspacing="0">
               <tr><td>
                       <table cellpadding="0" cellspacing="0"><tr><td>
                             <script language="javascript">
                             diapo2()
                             </script>
                      </td></tr></table>
                      <table cellpadding="0" cellspacing="0"><tr><td>
                             <script language="javascript">
                             diapo2()
                             </script>
                      </td></tr></table>
                      <table cellpadding="0" cellspacing="0" border="1"><tr><td>
                             <img src="photo.jpg">
                      </td></tr></table>
               </td></tr></table>
               </td></tr></table>
        </td></tr></table>
</td></tr></table>


et le CSS : 


body{
     width: 1100px;
     height: 850px;
     margin: 8px 8px 8px 8px;
     font-family: "Trebuchet MS", sans serif;
     color: #ffffff;
}

table#index {
    background-color:#000000;
    border: solid #000000 1px;
    width: 1100px;
    height: 850px;
}

table#page-index {
    background-color:#000000;
    border: solid #ffffff 1px;
    width: 400px;
    height: 250px;
    margin-left: 85px;
    margin-right: 20px;
    margin-top: 15px;
}



table#images {
    background-color:#000000;
    width: 845px;
    margin-top: 10px;
    margin-left: 22px;
    margin-bottom: 15px;
    border: solid #000000 0px;

}

table#encarts {
    background-color:#000000;
    width: 300px;
    margin-top:10px;
    margin-right:35px;
    border: solid #000000 0px;
}

table#bordure1{
    background-color:#B6BBBF;
    width: 541px;
    height: 433px;
    border: solid #B6BBBF 5px;
}

table#bordure2{
    background-color:#DDDEE0;
    width: 529px;
    height: 433px;
    border: solid #DDDEE0 12px;
}

table#bannieregauche-index{
    background-color:#DDDEE0;
    width: 516px;
    margin-left:20px;
    margin-top: 10px;
    border: solid #DDDEE0 0px;
}

table#menu{
     width: 830px;
     margin-top: 53px;
     margin-left: 20px;
     font-family: "Arial Narrow", sans serif;
     font-size: 14px;
     color: #ffffff;
}

table#principal {
    background-color:#000000;
    width: 516px;
    height: 433px;
    border: solid #000000 0px;

}


Merci d'avance ...
Sujet clos
Aller à