28220 sujets

CSS et mise en forme, CSS3

Menu roll over qui ne reste pas ou il faut !

Bonjour,

j'ai un soucis avec mon menu roll over qui ne gere pas le changement de dimension des pages web : le menu garde sa taille d'origine et décalle ainsi le texte situé en-dessous, ce qui créé une vraie pagaille sur ma page.

.menu a:hover {
color: #2a9f59 ;
font-weight:blod ;
background: url(images/ok.gif) no-repeat -5px 0px;
}


j'ai aussi un problème pour faire apparaitre une image lorsqu'on survolle un lien : je voudrais faire apparaitre une croix à gauche du texte, mais l'image ne veut apparaitre que sur ce texte et pas en décalé...

ul#menu {
background-color: #305f73;
margin-left: 30px;
list-style-type: none ;}

ul#menu li {
float: left ;
text-align: center ; }

ul#menu li a {
display: block ;
width: 142px ;
font-size:1.1em;
font-weight:bold;
letter-spacing: 1.3px;
line-height: 30px ;
color: #fff ;
background: url(images/menu.gif) no-repeat 0 0 ;
text-decoration: none ;
border-right: 2px solid #E2E8EA ; }

ul#menu li a:hover {
background: url(images/menu.gif) no-repeat 0 -30px ; }


visible à : http://xthost.info/clinique/test

qqn aurait une idée svp ?
Modifié par paillou (02 Nov 2005 - 11:29)
pour ton probleme d'image qui apparait par dessus le lien au survol, c'est tout à fait normal car tu mets

ul#menu li a:hover {
background: url(images/menu.gif) no-repeat 0 -30px ; }

essaye plutot

ul#menu li a:hover {
background: url(images/menu.gif) no-repeat right;
padding-right:10px;
}

(le padding étant pour donner l'espace à l'image pour s'afficher)


Pour ton menu, tes <ul> ont une taille définie en pixels, donc fixe. le navigateur les décale alors pour pouvoir les afficher.
un solution pourrait etre de leur donner une position absolue, mais il faudrait connaitre le résultat que tu attends obtenir.
Merci pour l astuce,

Mais ca ne fait pas ce que je voulais, (le padding décale juste le texte et cela créé un effet "bizarre"), moi je veux juste afficher la croix lors du survol du lien à gauche du texte ...
Sujet clos
Aller à