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 ?
Configuration: Windows Vista / Safari 533.1

3 réponses

  1. Webmaster
    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 Pillou

    Fondateur de CommentCaMarche.net

    2
    1. 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 ?
      0
      1. Webmaster
        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.
        0
    2. Réduit ton top:3.4%.

      Tu codes avec quelle version ?
      0