Pb css / mozilla

[ideezik]

J'ai un petit pb de compatibilité css avec Mozilla. J'ai fait un rollover en css sur une image pour que la bordure passe de solid à dotted au survol de la souris.
Sous IE, nickel. Ca marche impec. Mais sous mozilla : arghhh : gros bug bien vilain. Le css est validé par le w3c et j'arrive à pas à trouver le bug. Si vous pouvez m'aider... voila le code :

a.image {width:72px; height:73px; border:1px Solid black; }
a.image:hover {border:1px Dotted black; }

[...]

<a href="affich75.php" class="image"><img src="img/covers/freestylers.gif" width="72" height="73" border="0" alt="Freestylers - We Rock Hard"></a>

 

[Remi L.]

Le validateur CSS ne peut que vérifier s'il y a une erreur de syntaxe, c'est tout. Donc le fait qu'il passe au validateur ne signifie pas forcément que tes CSS sont bons.
Tu peux déjà virer le width et height sur le 'a.image'...

 

[George Abitbol]

Pourquoi ne pas plutôt mettre la bordure sur l'image ?

a.image:link img { border:1px solid black; }
a.image:visited img { border:1px solid #555; }
a.image:hover img, a.image:active img { border:1px dotted black; }

(et enlève le border="0" du tag image)

Et si tu veux ça sur toutes les images-liens, tu mets juste :

a:link img { border:1px solid black; }
a:visited img { border:1px solid #555; }
a:hover img, a:active img { border:1px dotted black; }

Fred

 

[ideezik]

En le codant de cette manière, ca marche sous mozilla mais plus sous IE !

IE ne veut pas du hover. Sous mozilla ca marche impec.

Pourquoi je m'en doutais :lol:

 

[yannouk]

je suis pas sur de moi, mais essaye un display:block sur le "a"
moi aussi mozilla me compliqyue la vie, il ne redimmensionne pas automatiquement un conteneur relatif en fonction de la hauteur du contenu...pas pratique