28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je renconctre actuellement des problèmes sous IE6 avec les combinaisons de styles.

A partir du code HTML suivant:

<div class="style1 style2">test</div>


J'applique la feuille CSS suivante:

div.style1.style2 {background-color: #ff0000;}
div.style3.style1 {color:#0000ff;}


Sous Firefox/IE7, pas de problème.
En revanche sous IE6, le second style de la feuille s'applique... Smiley confus

J'ai noté que d'inverser les styles permet de résoudre le problème:

div.style3.style1 {color:#0000ff;}


Mais cela a fatalement des effets de bords lorsqu'un élément HTML a le style "style3"...

Est-ce un bug connu? (je n'ai rien trouvé sur Google)

Existe t'il une astuce quelconque pour contourner le problème (autre que de réécrire toute la feuille de style)...

Merci.
Modifié par bplaquevent (19 Sep 2008 - 13:02)
Hello,

IE6 comprends mal l'utilisation de multiples classes sur un même élément : .class1.class2.class3 sera interprété par IE6 comme .class3 (la dernière classe de la liste)

Il n'y a pas de moyen de lui faire comprendre à part de cibler autrement les éléments à ma connaissance

Le side effect positif de ce "bug" est qu'on peut facilement appliquer des effets uniquement à IE6 sans se fatiguer en rajoutant une classe bogus à nos déclarations, du genre .ie6.maclass { } (en considérant que la classe ie6 n'est pas définie dans le html).
Enfin bon, je m'éloigne du sujet là Smiley langue
Modifié par Tymlis (20 Sep 2008 - 03:49)
Tymlis a écrit :
Le side effect positif de ce "bug" est qu'on peut facilement appliquer des effets uniquement à IE6 sans se fatiguer en rajoutant une classe bogus à nos déclarations, du genre .ie6.maclass { } (en considérant que la classe ie6 n'est pas définie dans le html).

Mouarf Smiley biggrin

Pas mal l'alternative aux commentaires conditionnels.