[Résolu] Items d'une liste qui restent en ligne : pourquoi ?

Bonjour,

Je craque sur un problème simple : les items d'une liste restent en ligne désespérément (alors que je souhaite les mettre les uns sous les autres)

Voici mon code si vous avez une piste je suis preneur...

.liste{
	float: left;
	width:590px;
	height:auto !important;
	height:20px;
	min-height:20px;
	margin:0px;
	padding:0px;
}	

.liste ul{
	list-style: none;
	display: block;
	margin:0 0 0 15px;	
	padding: 10px;
	line-height: 1.5em;
	}

.liste ul li{
	margin:0px;
	padding: 10px;
		
}

et dans ma page :

<div class="liste">

<ul>
<li><a Href="truc">Pouet</a></li><li><a Href="truc">Pouet</a></li><li><a Href="truc">Pouet</a></li><li><a Href="truc">Pouet</a></li><li><a Href="truc">Pouet</a></li><li><a Href="truc">Pouet</a></li><li><a Href="truc">Pouet</a></li>	

</ul>

</div>

Merci !
Modifié par pan (18 Nov 2008 - 16:09)

Bonjour pan,

Je ne dois pas être bien réveillé ou ton souhait est mal exprimé ?!
Par défaut les listes d'item ont un type de rendu block, sans information contraire (display:inline ou float:left ou right) ils se place les uns sous les autres, non ?...

A quoi sert le display:block sur le conteneur ul ?

Je vais boire un autre café, j'ai dû raté quelque chose et je reviens, si tu as plus d'infos à nous (me) donner d'ici là...une image de ce que tu cherches à obtenir, une page en ligne...

Cdt,
Sylvain

Mon problème est que justement le contenu de ma liste n'est pas sous forme de liste mais s'affiche en ligne...

En fait ce que je veux c'est que mes items s'affichent sous la forme d'une liste, pas sous forme de paragraphe (ce qui est le cas actuellement).

pan a écrit :
En fait ce que je veux c'est que mes items s'affichent sous la forme d'une liste, pas sous forme de paragraphe (ce qui est le cas actuellement).

S'ils s'affichent comme des paragraphes (donc sans puce ou autre marqueur de liste, conséquence du list-style: none), ils ne s'affichent donc pas «en ligne».

Florent V. a écrit :

S'ils s'affichent comme des paragraphes (donc sans puce ou autre marqueur de liste, conséquence du list-style: none), ils ne s'affichent donc pas «en ligne».

Quand je dis en ligne c'est sur la même ligne... désolé

pan a écrit :
Quand je dis en ligne c'est sur la même ligne... désolé

Oui, et des paragraphes ne s'affichent pas sur la même ligne, donc dans ce cas tes LI ne s'affichent pas comme des paragraphes.

Houston, on a un problème de vocabulaire ici.

Petite capture d'écran de l'affichage que tu obtiens, page en ligne, etc.?

Je peux pas trop mettre de capture d'écran mais si tu veux, tous les items sont sur une seule et même ligne, voilà, je sais pas quoi dire de plus...

Hello,

Je suis un peu perdu avec les en lignes là
J'ai testé et chez moi ça marche très bien IE7 et FF3, mon doctype est en XHTML transitional.

Peux pas dire mieux

Bon courage

Ps: Je rejoins Sylvain avec le fait que tu peux supprimer le display block de ton <ul>

copperfield a écrit :
J'ai testé et chez moi ça marche très bien IE7 et FF3, mon doctype est en XHTML transitional.

Oui, le code indiqué n'explique pas que les LI se placent sur une seule et même ligne (sauf retour à la ligne éventuel s'il le contenu est trop important). Comme dit précédemment, c'est un comportement que l'on obtiendra avec du display: inline, display: inline-block (ou éventuellement du float) sur les éléments LI.

Comme il n'y a rien de tel dans le code indiqué, ça doit venir... d'un code non indiqué. Ce que l'on pourrait repérer en voyant la page en ligne, mais vu que c'est pas possible... eh bien pan c'est à toi d'enquêter.

Pour rappel: Firebug, pour savoir quels styles s'appliquent à un élément, c'est bien.

Florent V. a écrit :

Oui, le code indiqué n'explique pas que les LI se placent sur une seule et même ligne (sauf retour à la ligne éventuel s'il le contenu est trop important). Comme dit précédemment, c'est un comportement que l'on obtiendra avec du display: inline, display: inline-block (ou éventuellement du float) sur les éléments LI.

Comme il n'y a rien de tel dans le code indiqué, ça doit venir... d'un code non indiqué. Ce que l'on pourrait repérer en voyant la page en ligne, mais vu que c'est pas possible... eh bien pan c'est à toi d'enquêter.

Pour rappel: Firebug, pour savoir quels styles s'appliquent à un élément, c'est bien.

Firebug, ça me parait mortel ce truc
En tout cas merci pour vos réponses, je crois bien que la page a un big problème dans le codage, je vais jeter un oeil avec Frebug mais je crains de devoir m'y coller pour de bon...

Firebug c'est TROP BIEN !!!

J'ai réussi avec ce truc de la mort à régler mon problème : un float:left placé bien plus au que ma liste mais qui influait par héritage...

Bon me demandez pas le pourquoi du comment ; je l'ai commenté et ça marche...
Merci à tous