Probleme avec a:hover
Résolu
Bonjour, j'ai disposer 3 petits drapeaux sur ma page, j'ai réussi à faire le lien vers les autres pages, mais je voudrais que les drapeaux se lèvent quand on passe la souris dessus.
Voici mon code :
HTML
<div <a href="Home_german.html" class="drapeau_allemagne"></a></div>
CSS
.drapeau_allemagne{
width:41px;
height:19px;
position:absolute;
top:3.4%;
right:18%;
background:url("images/drapeau_allemagne.bmp") no-repeat;
}
.drapeau_allemagne a:hover{
width:29px;
height:41px;
position:absolute;
background:url("images/drapeau_allemagne2.bmp");
}
Vous voyez une erreur ?
Voici mon code :
HTML
<div <a href="Home_german.html" class="drapeau_allemagne"></a></div>
CSS
.drapeau_allemagne{
width:41px;
height:19px;
position:absolute;
top:3.4%;
right:18%;
background:url("images/drapeau_allemagne.bmp") no-repeat;
}
.drapeau_allemagne a:hover{
width:29px;
height:41px;
position:absolute;
background:url("images/drapeau_allemagne2.bmp");
}
Vous voyez une erreur ?
Configuration: Windows Vista / Safari 533.1
3 réponses
-
Oui tu t'es trompé :
a.drapeau_allemagne{ width:41px; height:19px; position:absolute; top:3.4%; right:18%; background:url("images/drapeau_allemagne.bmp") no-repeat; } a.drapeau_allemagne:hover{ width:29px; height:41px; position:absolute; background:url("images/drapeau_allemagne2.bmp"); }Jean-François PillouFondateur de CommentCaMarche.net
-
Coooooool ! Merci j'ai fais les changements ;)
Mais il me reste un soucis le drapeau se déploie vers le bas, alors que je voudrais vers le haut.
Comment qu'on fait ?-
Cela n'a rien à voir, mais normalement le format BMP n'est pas un format web, préfère plutôt un JPEG ou PNG.
Est-ce voulu que la largeur et la hauteur ne soit pas les mêmes dans les deux cas ? Pour ma part je ferais deux images de la même hauteur largeur, quitte à laisser du blanc en haut sur la première pour que le drapeau se lève dans la seconde.
Enfin, pense à remettre le no-repeat sur la seconde image.
-
-
