Hola, tengo un pequeño problema con las listas anidadas, para variar solo en IE por que en FF y Opera se ve bien.
La situación esta asi:
Quiero hacer un menu con listas, el HTML es el siguiente:
Código HTML:
<ul id="lista1">
<li id="elemento1">...<li>
<li id="elemento2">
<ul id="lista2">
...
</ul>
</li>
</ul> El problema esta en que "elemento2" es de tamaño definido y más pequeño que la segunda lista que contiene. Internet Explorer envuelve la segunda lista automaticamente aumentando el tamano de "elemento2" y esto rompe la posición de otros elementos cercanos. El CSS esta así:
Código:
ul {
margin: 0;
padding: 0;
list-style: none;
}
ul li {
float: left;
display: inline;
margin: 0 0 0 30px;
padding: 0;
}
#elemento2 {
width: 11px;
height: 11px;
display: block;
}
#elemento2 ul {
width: 200px;
height: 113px;
position: relative;
top: -110px;
left: 30px;
}
Lo que necesito es que "elemento2" quede con el tamaño fijo de 11 x 11 y "lista2" no quede dentro de los bordes haciendo que se agrande.
De antemano, Gracias!
Saludos