Probleme style sous IE6

Nicolas · 8 Juin 2007

Bonjour,

J'ai un probleme sous IE6 (mais cela fonctionne sous IE7 et Firefox 2):

le 1er <li> a pour classe "bouton1 select" mais l'image affichée est "bouton2_a.gif" !!.

En fait IE6 prend le background-image defini pour bouton2.select.

Note: Si on ajoute un bouton3 alors "bouton1 select" et "bouton2 select" afficheront l'image specifiée dans la valeur background-image du "bouton3 select"

DONC : propriétés de bouton1 select, bouton2 select, bouton3 select, bouton4 select, .... boutonI select = propriété de boutonN select

N etant le dernier element.

Est-ce quelqu'un aurait une idée pour résoudre ce problème svp ?

Merci d'avance

Code html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="fr">
<head>
<title>test-css</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css"><!--
	@import url(styles.css);
--></style>

</head>
<body>
	1	<ul class="navigation">
			<li class="bouton1 select">
				<a href="./test-select.php?id=1">menu1</a>
			</li>
			<li class="bouton2">
				<a href="./test-select.php?id=2">menu2</a>
			</li>
	</ul>


</body>

</html>

La feuille de style style.css

ul.navigation li.bouton1 a {
	background-image:url(./bouton_na.gif);
}

ul.navigation li.bouton1 a:hover, ul.navigation li.bouton1.select a {
background-image:url(./bouton_a.gif);
}


ul.navigation li.bouton2 a {
	background-image:url(./bouton2_na.gif);
}

ul.navigation li.bouton2 a:hover, ul.navigation li.bouton2.select a {
background-image:url(./bouton2_a.gif);
}

Nicolas · 8 Juin 2007

Apparement dans IE6 <xxx class="toto1 titi"> est interpreté comme <xxx class="titi">

et dans le css

xxx.toto1.titi{
PROPRIETES 1
}

xxx.toto2.titi{
PROPRIETES 2
}

xxx.toto3.titi{
PROPRIETES 3
}

equivaut à

xxx.titi{
PROPRIETES 1
}

xxx.titi{
PROPRIETES 2
}

xxx.titi{
PROPRIETES 3
}

donc il y a 3 fois la meme declaration et la derniere des 3 est logiquement pris en compte

IE 6 ne gere pas le mutliclasse : http://sonspring.com/journal/ie6-multi-class-bug

y a t-il un moyen de resoudre ce probleme pour qu'IE6 interprete de la meme façon qu'IE7 et FF2 ?? merci

Connexion

Probleme style sous IE6

Sujets conseillés

Nicolas

Nicolas

Veuillez vous connecter pour commenter

Parcourir

Activité