Hover sur les <LI> avec IE6

Résolu
timothee75006 Messages postés 3 Date d'inscription   Statut Membre Dernière intervention   -  
Devilish Messages postés 1425 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Je souhaite changer la couleur de fond des conteneurs <LI> de mon menu lorsque je passe la souris dessus. J'utilise pour cela le code suivant :

*********************************************************************************

mon html :

<ul id="menu">
<li><a href="#" target="_top" title="choix1">Titre1</a></li>
<li><a href="#" target="_top" title="choix2">Titre2</a></li>
<li><a href="#" target="_top" title="choix3">Titre3</a></li>
<li><a href="#" target="_top" title="choix4">Titre4</a></li>
<li><a href="#" target="_top" title="choix5">Titre5</a></li>
<li><a href="#" target="_top" title="choix6">Titre5</a></li>
</ul>

mon css :

ul#menu {
float:left;
width:800px;
list-style:none;
height:20px;
margin:0;
margin-left:20px;
padding:0;
padding-top:3px;
padding-bottom:1px;
text-align:center;
}
ul#menu li {
padding-left:20px;
padding-right:20px;
display:inline;
margin-right:8px;
border:1px solid #666666;
}
ul#menu li:hover {
padding-left:20px;
padding-right:20px;
display:inline;
margin-right:8px;
border:1px solid #666666;
background-color:#C6DF50;
}
ul#menu li a {
text-decoration:none;
font-size:14px;
color:#666666;
}

*********************************************************************************

Le problème est que sous IE6, les :hover ne sont applicables qu'à des "a".
Si je change le background-color dans un a:hover plutôt qu'un li:hover, seul la partie derrière les caractères du lien sera colorée mais pas le reste de mon rectangle. (J'espère avoir été clair...)

Quelqu'un a-t-il une astuce qui permettrait d'obtenir le résultat souhaité sous IE6 ?
Merci d'avance !

6 réponses

Devilish Messages postés 1425 Date d'inscription   Statut Membre Dernière intervention   38
 
Ben dans ce cas donne une taille a ton lien pas a ton li et ça iras... En gros tu donne tout tes attributs css de tes <li> a tes liens, à la fin cela revient à la même chose...
2
Devilish Messages postés 1425 Date d'inscription   Statut Membre Dernière intervention   38
 
Ben tu as déjà la réponse...Met le hover sur le a pas sur le li... IE6 n'applique le hover qu'au lien et à rien d'autre...
0
timothee75006 Messages postés 3 Date d'inscription   Statut Membre Dernière intervention  
 
Le prob c'est que encore bcp de monde utilise ie6 et je veux assurer la compatibilite.
Si je met le hover sur le a, seulement le lien est surligne et j aimerais que tout le carré du ni soit rempli avec la couleur.

Merci pour vos reponses !
0
timothee75006 Messages postés 3 Date d'inscription   Statut Membre Dernière intervention  
 
Je viens de suivre ton conseil Devillish et effectivement ça fonctionne bien.
Merci !
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Devilish Messages postés 1425 Date d'inscription   Statut Membre Dernière intervention   38
 
De rien^^.
0
desperadosse Messages postés 201 Date d'inscription   Statut Membre Dernière intervention   7
 
La première chose que je te dis moi c'est : CHANGE D'EXPLORATEUR ^^ (c'est pas méchant)

IE6 ne marche plus trop, et surtout pour la vérifications de ton script.
Mozilla conviendrait et IE7 à la limite.

Desperadosse
-7