Mes puces sont désordonnées !

Bonjour,

Je rencontre un problème sur mes puces...

Voila le code css:

.puce ul { list-style-type:none; }
.puce li {
	background: transparent url(/test/images/puce-pachira.jpg) no-repeat;
	font: normal 12px Tahoma, Arial;
	height:20px;
}
.puce span {padding-left:25px;}

Le code html:

<div class="puce">
<ul>
<li><span>1 boîte Pachira Relax</span></li>
<li><span>1 boîte Pachira Flex</span></li>
<li><span>1 boîte Pachira Energy</span></li>
<li><span>1 boîte Pachira Slim</span></li>
<li><span>1 boîte Pachira Renew</span></li>
</ul>
</div>

Le résultat (partie droite dans la zone blanche) : http://voilou.fr/test/desc-produits.html

Pourquoi les puces/textes ne sont ils pas l'un sous l'autre? Je ne comprends pas car avec le meme code, sur la page ci dessous, les puces sont bien affichées... (http://voilou.fr/test/index_sub3.html cliquez sur plus d'infos pour le pack intense)

Merci
Jonathan

Hello,

A mon avis ça vient de ton float left sur les li.
Modifié par Skoua (28 Dec 2009 - 13:04)

Mais j ai pas de float left sur les li de la class puce...

Bnjour,

S'il y a un float sur li (sans classe) il serait pris en compte pour tous les li quelle que soit la classe qui leur est attribuée.

Bonjour,

Tant que t'y es, enlève aussi le height:20px; sur li, ça sera beaucoup mieux

merci c est règlé

Si le problème est [résolu] merci de l'indiquer dans le titre de ton premier message.

ps. : merci de faire également de même avec tous tes autres sujets.
Modifié par Laurie-Anne (28 Dec 2009 - 15:08)