Puce : alignement vertical du texte

Bonjour à tous,

j'ai un soucis sur un menu basé à partir de liste. J'aimerais aligner le texte de façon à ce que la deuxième ligne s'aligne sur la première, et ne se décalle pas.
Sur l'image jointe, je voudrais que "et Logistique" soit aligné avec le "S" de "Systèmes".

Voici le code :

#cartouche {
	float: left;
	line-height: 2em;
	width: 190px;
}
#cartouche ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#cartouche ul li, #cartouche ul ul.sousmenu li.active {
	padding: 0 10px;
}
#cartouche ul li.active {
	font-weight: bold;
	padding: 0;
}
#cartouche a {
	color:#6b6b6b;
}
 
#cartouche ul.sousmenu, #cartouche ul li.active a.active{
	line-height: 1.5em;
	padding: 0 10px 0 1em;
}
#cartouche ul.sousmenu li a {
    margin-left: 0;
    padding-left: 0.6em;
    text-indent: -0.5em;
    background-image: url(../images/puce_n2.gif);   
    background-repeat: no-repeat;
}

Bonjour, avec list-style-position: outside;

Mabelle a écrit :
Bonjour, avec list-style-position: outside;

Bonjour,

ça n'aligne pas le texte

Salut,

Regarde du côté de background-position.

EDIT :
Oups, j'ai juste regardé l'image sans lire ton message.

Donc, utilise tout de même background-position pour régler l'alignement vertical de la puce, et pour l'indentation du texte, faire passer les liens en display:block devrait faire l'affaire (ou déplacer la puce dans le <li> et y ajouter un padding-left).
Modifié par BeliG (21 Oct 2010 - 13:59)