Forum d'entraide PHPFrance

Bonjour,

J'ai un petit soucis pour gérer la hauteur des lignes de mes listes. Je m'explique: j'ai une liste dont chaque élément a une image de fond qui change quand on passe dessus. Le problème est que je n'arrive pas à fixer la hauteur de la ligne, ce qui fait que les images sont coupées en haut et en bas.

Voici mon code:

Code : Tout sélectionner


.menu{
...

}

.menu li{
	margin:0px;
	padding:0px;
	padding-left:10px;
	padding-bottom:2px;
	list-style-image:none;
	line-height:20px;
}

.menu li a{
	color:black;
	font-size:0.9em;
	padding-left:18px;
	background-image:url(../images/16/ledorange.png);
	background-repeat:no-repeat;
  	background-position: 0 50%;
}

.menu li a:hover {
	color:red;
	padding-left: 18px;
	background-image:url(../images/16/ledyellow.png);
	background-repeat:no-repeat;
  	background-position: 0 50%;
}

Merci bien

met un line_height sur le "a" aussi

Code : Tout sélectionner

li a {
    line-height: 20px;
    /* etc... */
}

J'ai rajouté un line-height sur les balises li a, et li a:hover...
J'ai mis une copie d'écran pour illustrer:

Ca fait un petit moment que je me prends la tête dessus, je ne vois pas ce que je fais mal...

Alors rajoute encore un padding: 0 pour le même élément (li a { )

En effet, cela venait bien du padding des balises li a.

Merci bien Cyrano

Forum d'entraide PHPFrance

Hauteur de ligne d'un <li>

Hauteur de ligne d'un <li>