[CSS]Fallo de altura de divs y listas en IE6

Hola:

Haber si me podeis ayudar, tengo un problema un poco raro con IE6. Resulta que tengo 2 menus verticales simplemente compuestos por listas en vertical sin estilo. En FF y en IE7 los menus se ven genial, pero en IE6 los div que contienen las listas se comprimen como si las listas que contienen se salieran fuera y por tanto no adquirieran su tamaño. Por tanto, se montan un menu en otro.

Como es un poco complejo de explicar, os pongo una imagen comparativa del problema con FF, IE7 e IE6.

Ademas aqui os dejo el codigo de los menus:

Código :

<div id="columna1">
    <div id="general">
        <ul id="general">
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) bottom center no-repeat;"><a id="inicio" href="#">» Inicio</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) bottom center no-repeat;"><a id="inicio" href="#">» Noticias</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Guias</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Descargas</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Foro</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Contacto</a></li>
            <li style="background:#3d3d21;"><a id="inicio" href="#">» Sitemap</a></li>
        </ul>
        <div id="foot"></div>
    </div>

    <div id="secciones">
        <ul id="secciones">
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) bottom center no-repeat;"><a id="inicio" href="#">» Servidores</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) bottom center no-repeat;"><a id="inicio" href="#">» Alistamiento</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Rosters</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Miembros</a></li>
            <li style="background:url(../images/maquetacion/columna1/separador.jpg) #3d3d21 bottom center no-repeat;"><a id="inicio" href="#">» Tienda</a></li>
            <li style="background:#3d3d21;"><a id="inicio" href="#">» Afiliados</a></li>
        </ul>
        <div id="foot"></div>
    </div>
</div>

Y el codigo correspondiente de CSS:

Código :

div#columna1 {
   width:186px;
   float:left;
   padding:0 0 0 4px;
   margin:10px 10px 0 0;
}

div#columna1 div#general {
   width:186px;
   background:url(../images/maquetacion/columna1/head_general.png) transparent no-repeat !important;
   background: none;
   filter: none !important;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/maquetacion/columna1/head_general.png');
   padding-top:49px;
   margin-bottom:10px;
}

div#columna1 div#secciones {
   width:186px;
   background:url(../images/maquetacion/columna1/head_secciones.png) transparent no-repeat !important;
   background: none;
   filter: none !important;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/maquetacion/columna1/head_secciones.png');
   padding-top:49px;
   margin-bottom:10px;
}

div#columna1 div#foot {
   width:186px;
   height:28px;
   background:url(../images/maquetacion/columna1/pie.png) no-repeat !important;
   background: none;
   filter: none !important;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/maquetacion/columna1/pie.png');
}


div#columna1 ul {
   margin:0;
   padding:0;
   list-style:none;
   border-left:1px solid #46463a;
   border-right:1px solid #46463a;
   position:relative;
}

div#columna1 li {
   width:184px;
   height:19px;
   margin:0;
   text-indent:18px;
   padding-top:2px !important;
   padding-top:0px;
}

div#columna1 li a:link, 
div#columna1 li a:visited {
   padding:0;
   text-decoration:none;
   color:#d5c953;
}

div#columna1 li a:hover, 
div#columna1 li a:active {
   font-weight:bold;
   color:#d5c953;
}

Gracias a todos de antemano.

No sé si será por eso, pero tienes una cosa mal: Hay dos elementos (2 veces) con el mismo id. El atributo id es único en todo el documento html.

cierto totalmente, pero creo que no influye en el fallo porque en el CSS he especificado que pongo reglas para el div#general, entonces no deberia afectar al otro.

PD: Te lo confirmo, he probado y no hay ningun cambio si le quito el atributo id a los uls.