[Résolu]Problème de rollover image décalée

Bonjour à tous,


J'ai un problème avec un rollover css sur une image. L'image se met systématiquement à la ligne, ce qui ets embêtant pour le graphisme.

N'ayant rien trouvé en recherchant je me permet de poster ici.

Voici le code html :

                <form action = "index.php?page=138" id = "form_recherche" enctype = "multipart/form-data" method = "post">
                <div id  = "h_milieu">
                        Recherche : <input type = "text" name = "recherche" value = "" size = "15"/>
                &nbsp;
                <a class = "bouton_fleche" title = "rechercher" href = "javascript:rechercher()"></a>
                </div>
                </form>

et le css associé :

#h_milieu {
        position : absolute;
        display: block;
        left : 750px;
        top : 82px;
        border: 1px solid green;
        width: 200px;
        text-align: left;
}

[code]a.bouton_fleche {
        display: block;
        width: 25px;
        height: 24px;
        background-image: url(images/bt_fl_off.jpg);
        background-repeat: no-repeat;
}

a.bouton_fleche:hover {
        background-image: url(images/bt_fl_on.jpg);
}

Avez-vous une idée ?

Merci
Modifié par Pandora (24 Oct 2005 - 09:35)

Bonjour,

Ta CSS transforme ton <a> en bloc, donc il passe à la ligne. Il faut que tu utilises un peu de positionnement pour le mettre où tu veux, du genre :

a.bouton_fleche {
...
position:absolute;
top:0px;
right:0px;
...
}

Mais tu auras quelques aménagements de dimensions sur ton div a prévoir.

Au passage sinon, inutile de mettre "display:block" pour ton div, il l'est déjà




(edit : c'est réglé Igor, j'ai du cafouiller dans la rédaction et je ne m'en était même pas aperçu !)
Modifié par Nilpohc (23 Oct 2005 - 20:14)

@Nilpohc
Ne pas oublier les bonnes partiques du forum: [ code] et [ /code]

Je ne sais pas pourquoi parfois je passe à coté de choses aussi simples, que de repositionner l'image .

Pour le block, ct un reste d'essai désespéré par tatonnement pour placer correctement mon image.

En tout cas merci du conseil, celà marche très bien du coup.