Listas espacio en IE

[lizfranco]

Hola todos,

Hice una lista para un menu, pero me sale con un espacio en IE, en Firefoxe se ve bien. tengo este cógido:

Código HTML:

.divtclients {
	width:100%;
	\width: 99%;
	w\idth: 99%;
	margin-bottom:9px;
}
#tclients_list {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.divtclients_title{
	font-weight:bold;
	font-size:14px;
	color: #CE6B16;
	text-align:left;
	padding: 1px 5px 1px 0px;
	margin-left: 12px;
}
.divtclients_links{
	font-weight:normal;
	font-size:12px;
	color: #42ABE7;
	text-align:left;
	padding: 1px 5px 1px 0px;
	margin-left: 12px;
}
.divtclients_line {
	margin-left:8px;
	margin-right:8px;
	border-bottom: 1px solid #CE6B16;
}

HTML

Código HTML:

<div class="divtclients"> <!--Menu contact-->
    <ul id="tclients_list">
        <li class="divtclients_title">Our Recent Client Sites</li><li class="divtclients_line"></li><li class="divtclients_links">Secure Monde International</li><li class="divtclients_line"></li><li class="divtclients_links">Quocirca</li><li class="divtclients_line"></li>
    </ul>
</div><!--menu contact--> 

Intenté agregándole
li {_display:inline;}

Pero me une todo, mi lista es vertical...
Qué debo agregarle o eliminarle para que me muestre el menu igual en IE que en Firefox?

Gracias,
Liz

[jesusbet]

Si quieres una lista vertical que haga la función de menú, simplemente haces esto:
<div id="menu">
<ul>
<li><a href="#"><span>Item</span></a></li>
<li><a href="#"><span>Item</span></a></li>
<li><a href="#"><span>Item</span></a></li>
<li><a href="#"><span>Item</span></a></li>
</ul>
</div>

y en la CSS...
#menu {
width: medida del bloque;
}

#menu ul {
list-style: none; /* estilo de la lista */
}

#menu ul li {
font-family: familia de funete;
font-size: tamaño de fuente;
line-height: altura de la linea de texto;
border-bottom: solid 1px color;
}

#menu ul li a {
text-decoration: none;
}


-----

la etiqueta span la agregué por si quieres algún otro 'efectito' o algo, la puedes quitar si quieres.

Saludos

[lizfranco]

Gracias jesusbet,

pero aun no sé que debo agregar o cambiar. Y tengo la lista, pero en IE me la muestra así:

http://www.geocities.com/af1pics/lista1.jpg

Y en Forefox me la muestra tal como la quiero:

http://www.geocities.com/af1pics/lista1.jpg

En un mensaje de este foro alguien tuvo el mismo problema pero lo solucionó cambiando:
<li>
<a>
</a>
</li>

Por: <li><a></a></li><li><a></a></li><li><a></a></li>

A mi no me funcionó. Tampoco si le agrego: li {_display:inline;}



Liz

[Remo:Erdosain]

¿Alguna razón en particular para tener esos LIs vacios?

[lizfranco]

Gracias jesusbet,

pero aun no sé que debo agregar o cambiar. Y tengo la lista, pero en IE me la muestra así:

http://www.geocities.com/af1pics/lista1.jpg

Y en Forefox me la muestra tal como la quiero:

http://www.geocities.com/af1pics/lista1.jpg

En un mensaje de este foro alguien tuvo el mismo problema pero lo solucionó cambiando:
<li>
<a>
</a>
</li>

Por: <li><a></a></li><li><a></a></li><li><a></a></li>

A mi no me funcionó. Tampoco si le agrego: li {_display:inline;}



Liz

[lizfranco]

Lo siento, publiqué el mismo mensaje dos veces.

Remo:Erdosain, te refieres a estos <li>:
<li class="divtclients_line"></li>
Pues los puse por el diseño, le iba a poner margen al final de la palabra pero me gustaría que la linea se separara un una distancia mas corta del margen izquierdo que las palabras...

Crees que sea por eso?

Liz

[Remo:Erdosain]

No tengo acá para probar, pero apostaría a que sí te está haciendo problemas

[iPunto]

Yo tuve el mismo problema y opte por quitar la lista y poner los <a> uno detrás de otro.

[jesusbet]

y si le pones un padding-top y un padding-bottom de 5px???