28173 sujets

CSS et mise en forme, CSS3

Bonjour,

je construis une liste à laquelle je donne le style suivant :


.cadreDroite ul {
list-style-position: inside;
margin-left: 0;
padding: 0;
}

.cadreDroite li {
margin-left: 0;
list-style-position: inside;
list-style-image: url('/images/arrow.gif');
padding: 0 5px;
text-decoration: none;
text-align: left;
}


quand je visualise, le texte d'un LI est collé à son image, et je n'arrive pas à mettre un petit espace entre l'image et le texte.
<li>mon texte</li> renvoit >mon texte
je ne trouve pas malgré mes recherches... Merci

edit: j'ai oublié de preciser que c'est nickel avec FF mais pas bon avec IE, bien sur Smiley rolleyes
Modifié par bideur (02 Mar 2006 - 21:53)
Administrateur
Bonjour,

merci d'éditer ton sujet pour y insérer des balises [ code] ... [ /code] (sans les espaces) ce qui rendra plus lisible pour tout le monde le code (c'est expliqué dans l'Aide)
Salut bideur,

Le phénomène s'explique par cette règle pour ton <li> :

list-style-position: inside;

donc soit tu passes en outside, soit tu utilises un <span> pour englober ton texte et tu lui applique un padding à gauche.

Smiley biggrin
Nilpohc a écrit :

donc soit tu passes en outside, soit tu utilises un <span> pour englober ton texte et tu lui applique un padding à gauche.


1/ ne marche pas
2/ marche Smiley smile

c'est resolu, merci