28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Pour mon site j'utilise parfois un menu statique à gauche de la page. Ce menu contient une liste de liens. Pour ces liens j'affiche une puce classique devant.

Cependant, sous IE, lorsque le lien est trop long et qu'il est sur deux lignes, la puce se positionne sur la deuxième ligne et non sur la première.

Voici le CSS de mon menu :



#menus {
	width: 180px;
	float: left;
}
#menus h3 {
	text-align: center;
}
#menus li {
	width: 150px;
}
#menus a {
	color: #d1d1d1;
	font-size: .85em;
}
#menus a:hover, #menus a:focus {
	color: #ce1215;
}



Et voici ce que ça donne en ligne : http://zemickyunivers.free.fr/poemes_intro.php

Avez-vous une petite idée d'où cela pourrait venir ?

Par avance merci.

Micky
Modifié par bisca330 (17 Feb 2011 - 12:06)
J'ai résolu le problème. Il faut ajouter "width: auto;" pour les li. Ce qui donne :



/* menus */

#menus {
	width: 180px;
	float: left;
}
#menus h3 {
	text-align: center;
}
#menus li {
	width: 150px;
	width: auto; /* Pour que IE puisse aligner la puce sur la première ligne d'un élément qui s'étend sur plusieurs lignes */
}
#menus a {
	color: #d1d1d1;
	font-size: .85em;
}
#menus a:hover, #menus a:focus {
	color: #ce1215;
}




Désolé pour l'éventuel dérangement.

Micky