Version complète: sur le forum Webmaster Hub : la taille des pixels entre IE et FF
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
K-ZimiR
vendredi 29 octobre 2004 à 11:07
Bon je suis devant une petite problématique :

voilà j'ai une zone de contenu, et dans cette zome j'ai une colonne gauche et une droite.

CODE
#zmcontenu{
    position:absolute;
    left: 50%;
    margin-left: -390px;
    top: 389px;
    width: 780px;
    background: url(ziomm_ts-body.png) repeat-y;
}

.zmcolgauche{
    text-align: justify;
    margin-left: 20px;
    width: 500px;
    background: #ffc;
    float: left;
}

.zmcoldroite{
    margin-right: 42px;
    width: 180px;
    background: #aaf;
    float: right;
    padding-left: 5px;
    border-left: 1px solid #ccc;
    min-height: 300px;
}


la page :

CODE
<div id="zmcontenu">
     <div class="zmcolgauche">
   <br />
   <br />
   <br />
   <br />
     </div>
     <div class="zmcoldroite">
   <br />
   <br />
     </div>
     <div class="zmfooter"></div>
 </div>


Et je constate que IE et Firefox ne comprennent pas le margin-left: 20px; de la colonne de gauche de la même façon. Avec Firefox, c'est correct (surprenant non ? :yoot: ), avec IE ( :down: ) le rendu est bizzarre. Pourtant je pensais qu'un pixel est un pixel

En fait le margin-left devrait être à 45 pour que l'aspect visuel soit correct avec FF mais je l'ai mis à 20 pour donner l'aspect final avec IE.

Comment faire pour que IE comprenne 45px comme FF ?
Merci.

**** edit ****
l'adresse où vous pouvez voir la page :
http://maquettes.suliworld.com/ziomm/teamspeak/
LaurentDenis
vendredi 29 octobre 2004 à 11:45
Au plus simple, si tu veux spécifier une marge réservée à IE, tu peux utiliser l'un des hacks suivants:
CODE
.zmcolgauche{
    margin-left: 20px;
    width: 500px;
    background: #ffc;
    float: left;
}
html>body .zmcolgauche {
    margin-left: 47px;
}

ou

.zmcolgauche{
    margin-left: 47px !important;
    margin-left: 20px;
    width: 500px;
    background: #ffc;
    float: left;
}
K-ZimiR
vendredi 29 octobre 2004 à 11:52
en fait j'ai trouvé la solution : j'avais un float: left et un float: right ... j'ai tout mis en float: left et ohhhhh, miracle.
J'ai également spécifié un padding-left à ma zone de contenu, ce qui m'évite d'utiliser les marges.

Mais merci poru le hack, je vais me le noter wink.gif
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.