28173 sujets

CSS et mise en forme, CSS3

Menu qui bouge :(

a écrit :
en enlevant la bordure ça disparait mais c'est moche ...


Voila tu sais d'ou vient ton problème donc...

#menu a { 
	display: block; 
	background: transparent; 
	width: 170px; 
	padding: 2px 10px; 
	text-decoration: none; 
	border-bottom: 1px solid #aaa; 
	}
#menu li li a { 
	border: 0; 
	color: #ff8000; 
	}
#menu li li a:hover { 
	display: block; 
	color: #000000; 
	background: #ff8000; 
	padding: 2px 10px; 
	margin: 0; 
	border: 1px solid #777; 
	text-decoration: none; 
	font-size: 12px; 
	}


Tu as deux fois les liens de déclaré ce qui ne facilite pas les choses.
Etant donné que #menu li li a arrive aprés #menu a ce sont les styles de ce dernier qui sont prise en compte au cas ou elles sonr redondantes, donc c'est border: 0; qui est appliqué
et comme un as une bordure de 1 px sur le a:hover, tu as un décalage de 1 px sur toutes tes rub.
Modifié par Hermann (14 Jun 2006 - 22:20)
Salut,

a écrit :
le menu bouge au passage de la souris

Ceci dit plus besoin de flash pour faire des sites animés !

Ok je sors --->
Salut,
j'ai le meme pb et j'ai trouvé la solution:
en fait il y en a 2 :

1ere: du met un border de 1px pour tes liens a: et une taille de texte de -1px pour le a:hover

2eme: du met un padding de 1px pour tes liens a: et un padding de 0px plus un border de 1px pour le a:hover
merci probleme resolu grace a vous deux, j'ai appliqué la solution de seb nantes mais c'est pas un peu << bidouille >> ??? un txt a -1 px...
Mettre une bordure blanche par défaut sur les liens du menu, et se contenter de changer la couleur de la bordure au survol.

Le fait que ça « bouge » vient du fait que dans le modèle de boîte CSS les bordures se rajoutent aux dimmensions (hauteur, largeur) spécifiées, qui sont en fait les hauteurs et largeurs des zones de contenu, et non pas du bloc entier.
Sujet clos
Aller à