Appliquer un style sur un élément avec :hover

Bonjour, je ne connais pas le nom de cette méthode, lorsqu'on utilise le symbole : ">" en css3 ?
Mon problème :
j'essaie d'appliquer un style à la balise "a" de "a href" lorsque je survol les éléments "li" d'une liste, mais ça ne marche pas ! :
voici le code html:

<div id="Menu">
<div class="ico-menu">
<ul><li><a href=""></a></li></ul>
</div>
<div class="titre-menu">
<ul><li><a href=""></a></li></ul>
</div>
</div>

voici le code css:

#Menu .ico-menu li:hover{background:#ffffff;}
#Menu ul li:hover > #Menu .titre-menu li a{border-top:2px solid white;}

Salut,
si on ne connait pas, vaut mieux ne pas s'en servir et se documenter non ?
Le manouel ici http://www.w3schools.com/cssref/css_selectors.asp
et en tapant "selecteur CSS" ou "selecteur CSS3" tu as de quoi te ressourcer.

#Menu .ico-menu li a:hover {}
#Menu .titre-menu li a:hover {}
???
Modifié par Yoan (03 Jul 2014 - 12:46)

Bonjour,

Si j'ai bien compris, tu peux faire ainsi :

#Menu .ico-menu li:hover {background:#ffffff;}
#Menu .titre-menu li:hover > a {border-top:2px solid white;}

Mais je ne comprends pas pourquoi tu souhaites appliquer l'événement survol aux <li> et non directement aux <a>

précision quant au but recherché :
le menu (wordpress) se présente ainsi:
le menu est composé de deux parties: la partie "icone" (au dessus) et la partie "nom" des onglets du menu (en dessous). lorsque je survol la partie "icone", je souhaite que la partie "nom" ajoute une bordure blanche en position top, et reciproquement lorsque je survol la partie "nom" je souhaite que la partie "icone" change sa couleur de fond.

optionnel :
jusqu'à présent je n'ai pas trouvé de solution pour le menu wordpress (wp_nav_menu) afin que icone, dont l'ajout est possible à partir de la version 3 de wordpress , puisse être positionnée au-dessus du label du menu et non à côté. Car on peut spécifié un style pour la classe de l'icone mais pas d'ajouter du code html pour recuperer des icones de la bibliotheque afin de les associer à un label (nom de l'onglet) du menu

Yoan, tu as raison,
mais en l'occurence je voudrais que les deux evenements li:hover sur ico-menu et titre-menu soit liés.
j'ai précisé mon problème dans le message précédent.

Raphael,
le problème est toujours le même : il faudrait que au survol des "li" ou des "a" que ico-menu et titre-menu est chacun un style différent mais lié par l'action du survol
j'espère être assez clair

Artenis a écrit :

Raphael,
le problème est toujours le même : il faudrait que au survol des &quot;li&quot; ou des &quot;a&quot; que ico-menu et titre-menu est chacun un style différent mais lié par l'action du survol
j'espère être assez clair

Ah, donc tu veux cibler le parent d'une élément survolé. Pas (encore) possible en CSS pur, désolé

Raphael,
j'etais au courant de cette impossibilité pour le "parent" c'est pour ça que je voudrais cibler au survol des "li" les "a href" qui sont normalement en "child" par rapport au "li"
et comme j'applique un ciblage au survol d'un élément situé après ça devrait marcher ! non ?

#Menu .ico-menu li:hover{background:#ffffff;}
		#Menu .ico-menu li:hover > #Menu .titre-menu a{border-top:2px solid white;}

et en raisonnant de cette façon ?
s-ico est la class de la balise a pour les icones et t-ico pour

#Menu  li:hover > #Menu li .s-ico{background:#ffffff;}
#Menu  li:hover > #Menu li .t-ico{border-top:2px solid white;}

Par contre ici si ça devait marcher en théorie,
il faut d'abord que je trouve le moyen d'ajouter une classe dans la balise "a" du wp_nav_menu