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 -
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 !
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 !
A voir également:
- Hover sur les <LI> avec IE6
- La la li la la la 90's song - Forum Cinéma / Télé
- Li-ion vs li-po smartphone - Forum Mobile
- Photo li tabloki facebook ✓ - Forum Facebook
- Tle tung-li - Forum Freebox
- Films avec jet li ✓ - Forum Cinéma / Télé
6 réponses
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...
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...
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 !
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 !
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question