[Résolu] Un roll over en CSS avec une seule image

Bonjour
J'ai essayer d'appliquer http://css.alsacreations.com/xmedia/exemples/design_css/etape4.html ainsi que http://css.alsacreations.com/Tutoriels-et-articles-divers/roll-over-css-image-unique pour faire mes menus, mais malheureusement le résultat n'est vraiment pas concluant!

Voici l'aperçu actuel: http://nuts.freezee.org/
Mon image de boutton(22px chacun): http://nuts.freezee.org/images/boutton.gif
Un aperçu du rendu souhaité : http://img479.imageshack.us/img479/3203/designprems7ei.png
(le boutton accueil a le fond d'une autre couleur, c'est pour vous montrez ce que sa doit donnez avec le hover)


Donc vous pouvez voir maintenant mon très gros problème et je vous serais très reconnaissant d'essayer de m'aider

Arthur
Modifié par Nuts (12 Feb 2006 - 10:12)

Hello Arthur,

Attention à tes sélecteurs CSS ! Il ne faut pas écrire n'importe quoi non plus !

Par exemple :

ul #menu li a {mes propriétés CSS...}

permet d'appliquer les propriétés CSS indiquées entre les deux accolades aux éléments a (des liens) qui ont comme élément parent ou ancêtre un élément de liste (li pour "list item") ayant lui même pour parent ou ancêtre un élément doté de l'identifiant menu, ayant lui-même pour parent ou ancêtre une liste non ordonnée.
Ce n'est pas du tout ce que tu as dans ton code HTML !

Vu ton code HTML, le sélecteur correspondant aura plutôt la tête suivante :

#headermenu a {...}

Ou si on veut vraiment faire long :

#headermenu ul li a {...}

Mais le premier suffit.

Pense donc bien à corriger tes sélecteurs, et s'il le faut à réviser le fonctionnement des sélecteurs CSS.

Ensuite, tu fais un lien vers ton image de fond à un moment (pour le lien), mais sans préciser le chemin vers ton dossier d'images ! Du coup, forcément, il ne trouve pas l'image.

De plus, tu n'affiches l'image de fond que lors du survol par la souris. Il faudrait commencer par l'afficher par défaut, et à modifier son positionnement au passage de la souris. Je crois que c'est l'objet du tutoriel dont tu parles.

Mais pour commencer avec les CSS, on peut peut-être faire des choses un peu plus simples, comme deux images de fond différentes pour tes boutons. La pseudo-classe :hover servira alors à changer l'image de fond sur les liens.
Modifié par mpop (12 Feb 2006 - 01:51)

Merci beaucoup pour l'aide, c'était effectivement ces petits détails bête qui me causaient le plus de probleme, et je vien de réussir a faire fonctionner corectement mon menu

Sujet reglé