Bonjour,

J'ai besoin de créer des liens avec une image (différente à chaque fois) et un texte. L'ensemble doit être réactif au passage de la souris.
J'ai donc créé :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
HTML :
<a href="#" class="test"><img src="toto.jpg" width="20" height="20" border="1" /> Texte</a>
CSS :
a.test {
	border: 1px solid green;
	text-decoration: none;
	}
a.test:hover {
	text-decoration: underline overline;
	}
mais l'espace entre l'image et le texte recevait alors les attribut de surlignage.
J'ai donc ajouté un <span> autour du texte pour qu'il soit le seul concerné par le hover (déplacé sur le span seul) :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
HTML :
<a href="#" class="test"><img src="toto.jpg" width="20" height="20" border="1" /> <span>Texte</span></a>
CSS :
a.test {
	border: 1px solid green;
	text-decoration: none;
	}
a.test:hover span {
	text-decoration: underline overline;
	}
Pas de pb sous FF mais sous IE, le hover ne fonctionne plus !