Lista en inline

[salbatore]

Hola, foreros:

Tengo una lista que en Safari y Firefox se ve en la misma linea, es decir, que despues de cada <li></li> no hay un salto de linea.

Por que ocurre que en Internet Explorer 6 no se ve en linea:

Código HTML:

<style>
	#lista {list-style:none}
	#lista a { background-color:#d0cfcd; width:187px; float:left;}
</style>

<ul id="lista"> 
	<li><a href="casa">Link</a></li>
	<li><a href="casa">Link</a></li>
	<li><a href="casa">Link</a></li>
	<li><a href="casa">Link</a></li>
</ul> 

¿Cual es la razon?

[Mikmoro]

La razón es que estás flotando lo que hay dentro de los elmentos de lista, no los propios elementos, y eso IE lo interpreta diferente. Haz esto:

#lista li { background-color:#d0cfcd; width:187px; float:left;}

[salbatore]

Hola, Mikmoro,

El problema lo tengo en que lo que quiero es que el link <a> tenga de anchura 187px y no el <li>

¿Sabes alguna otra manera?

[Mikmoro]

Muy fácil; échale un poco de imaginación:

#lista li {float:left;}
#lista li a { background-color:#d0cfcd; width:187px; float:left;display: block;}

[salbatore]

Hola, Mikmoro...

Muchisimas gracias!... funciona perfectamente!!