28173 sujets

CSS et mise en forme, CSS3

Bonjour bonjour

Lorsque je donne la valeur display: inline aux éléments d'une liste ul qui a une largeur donnée, cette largeur n'est pas respectée, les éléments li ne vont jammais à la ligne et agrandissent la taille de ul, seulement sur IE évidemment.

Que faire? En fait j'essaye aussi d'éviter de recourir à float: left quipose d'autre pb dans mon cas.

HTML


           <ul class="liste">
					
		<li ><a href="#">  Image1 </a></li>
		<li ><a href="#">  Image2 </a></li>
</ul>

.

HTML


           <ul class="liste">
					
		<li ><a href="#">  Image1 </a></li>
		<li ><a href="#">  Image2 </a></li>
...
</ul>


CSS


.liste { display:block;  position:relative; margin-left:10px; width:auto;}
.liste li{  display:inline;font-size:0.9em;}
.liste li a { color:#1D1D1D;  text-decoration:underline; padding-right:5px;}



upload/8768-ALSAarchi.jpg
auriez vous une explication à ce phénomène et surtout une solution.
Déja merci...
Modifié par simon250 (11 Mar 2007 - 18:10)
Bonsoir,
simon250 a écrit :

Lorsque je donne la valeur display: inline aux éléments d'une liste ul qui a une largeur donnée, cette largeur n'est pas respectée, les éléments li ne vont jammais à la ligne et agrandissent la taille de ul, seulement sur IE évidemment.

Qu'est ce qui différencie le rendu d'IE du reste?
Normal que les élément <li> n'aillent jamais à la ligne puisque la valeur inline
(en-ligne) de display permet justement d'afficher des élément en ligne,
mais cela a aussi pour effet d'empêcher les propriétés de taille (width et height) d'être prises en compte, entre autres.

simon250 a écrit :

Que faire? En fait j'essaye aussi d'éviter de recourir à float: left quipose d'autre pb dans mon cas.

Pourquoi float te pose problème?


.liste { display:block;  position:relative; margin-left:10px; width:auto;}

Le display:block est inutile dans ce cas puisque les <UL> sont déja des
éléments de type block et pareil le width:auto qui revient à ne rine mettre
puisque auto est la valeur par default. Celle-ci ne soit servir
qu'a réinitialiser sa valeur.

Le mieux serait de nous dire ce que tu souhaites obtenir.
Modifié par Hermann (11 Mar 2007 - 19:29)