28220 sujets

CSS et mise en forme, CSS3

[résolu] Background image et color disparaissent sous ie

Bonjour,

Je débute en CSS.
J'ai un bug d'afficahge sous IE (version 6 sous win2000 et XP surement sous 98) : le background image de mes titres h1 et background-color de mes éléments de liste ne s'affichent pas. Ils s'affichent uniquement en scrollant la page ou redimensionnant la fenêtre.

Le principe de ma page est
un menu gauche


#menugauche {
    position: relative;
    height: 100%;
    float: left;
    left: 0px;
    width: 150px;
}
#centre {
  /* la zone centrale d'affichage */
  margin-left: 154px; 
  background: #f8f8ce url('../img/bk2.jpg') repeat-x ;
  /*hack de flyman*/
  height: auto !important;
  height: 500px;  /* because ie */
  min-height: 450px;
}
/* suite hack de flyman pour ie*/
html>body #centre {
    height: auto;
}
#menudroit {
  float: right;;
  left: 600px;
  width: 150px;
  background-color: #fff;
}

#menugauche h1 {
    padding-left: 30px;
    background: url('../img/fleche_orange.gif') left center no-repeat;
    color: #000080;
    font-size: 10pt;
}
#menugauche ul { padding: 0px; margin: 0px; margin-bottom: 10px;}
#menugauche li {
    list-style-position:inside;
    list-style-image: url('../img/puce_tri_blue.gif');
    padding: 0; margin: 0px; margin-bottom: 2px;
    background-color: #dde8f1;
    color: #404080;
    font-weight:bold;
}
#menugauche li a {color: #0000ff;}

Mon code XHTML est :

<div id="menugauche">
  <div class="box">        
          <h1>Dossiers </h1>          
          <ul>           
            <li><a href="../dossiers/index.asp?genre=14">formation du réseau</a></li>            
            <li><a href="../dossiers/index.asp?genre=1">parrainage</a></li>            
          </ul>
          <h1>Dossiers 2</h1>
          <ul>
             <li><a href="#">autre  lien</a></li>
          </ul>
<!-- ainsi de suite -->
  </div>
</div>


Mes li doivent avoir un fond bleuté, sous Firefox, ça marche parfaitement, mais sous IE, le fond disparait. Il réapparait quand je scrolle la page (et encore pas tout le temps) ou redimensionne la fenêtre.
Pareil pour mon h1, l'image orange disparait sous IE de la même façon.

Je poste le lien d'une capture d'écran de IE avec le bug :
http://files.shawt.net/users/be_chuille/bugie.jpg

Et sous Firefox :
http://files.shawt.net/users/be_chuille/sansbugff.jpg

(Le désign n'est pas de moi, soyez indulgent).

Je dois avouer que je ne comprends pas d'où vient ce bug et je ne sais pas comment le résoudre. Je remarque aussi, que je le vois fréquemment sur mes sites en CSS.

Merci d'avance.
Modifié par be_chuille (10 Mar 2005 - 15:47)
Merci.
Jai essayé dans #menugauche de mettre line-height: 1.1em;
Et là les background-color de mes li et de mon h1 ne s'affichent plus.
J'ai essayé dans #menugauche h1 ou #menugauche li, sans succès.
Sujet clos
Aller à