Pourquoi ce sélecteur CSS ne fonctionne pas: a: hover ~ span?
a:hover + span { background:yellow; }
a:hover > span { background:yellow; }
a:hover ~ span { background:yellow; }
les deux premiers sélecteurs fonctionnent très bien. Toutefois, la troisième sélecteur ne fonctionne pas?
Démo: http://jsfiddle.net/UAHw7 /
pourquoi?
Maj: j'ai activé tous mes navigateurs ...
Opera 11 - Œuvres
Safari 5 - Travaux
Firefox 3.6-Works
IE9 RC-Works
Chrome 9-ne fonctionne pas
un problème de Chrome alors ...
Note: Comme Chrome ne contient plus ce bogue, cette question est obsolète.
3 réponses
ressemble à un bug Webkit lié à l'utilisation de la pseudo-classe :hover .
Il fonctionne très bien pour moi
- dans FF 3.6.13
- dans IE 8 de tous les navigateurs
- dans Opera 11
Il ne fonctionne pas pour moi
- Dans Chrome 9
- En Safari 5.0.3
pourrait être digne d'un fichier.
il me semble que vous ne pouvez pas combiner le sélecteur général ~ avec la pseudo-classe :hover ; notez que si vous changez le sélecteur en a ~ span , alors les deux éléments span deviennent jaunes.
Solution:
Chrome a un :hover problème. Surtout pour <a> .
-
:hoverne fonctionne pas en Chrome:
<a>Link</a> -
:hoveroeuvres en Chrome:
<a href="#">Link</a> -
:hoveroeuvres en Chrome:
<a href="javascript:void(0);">Link</a>
Note: Vous pouvez utilisez href="javascript:void(0)" au lieu de href="#" . Je préfère javascript:void(0) .