Hola chicos
Estoy creando un menú vertical con imagenes a partir de listas y manejo de hojas de estilo. Pero IE me crea una separación incómoda que afecta el diseño de la página, que no ocurre con firefox.
Este es el fragmento de código de la lista, por cierto, está dentro de otro div:
<!--html--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>
HTML </td></tr><tr><td id='CODE'><!--html1--><
div id="
menu">
<
ul>
<
li id="
enlace_menu_inicio">
<
span><
a href="
index.html">Inicio<
/a><
/span>
<
/li>
<
li id="
enlace_menu_intro" >
<
span>Introducción<
/span>
<
/li>
<
li id="
enlace_menu_objetivos" >
<
span>Objetivos<
/span>
<
/li>
<
li id="
enlace_menu_unidades">
<
span>Unidades<
/span>
<
/li>
<
li id="
enlace_menu_evaluacion" >
<
span>Evaluación del Curso<
/span>
<
/li>
<
li id="
enlace_menu_biblio" >
<
span>Bibliografía<
/span>
<
/li>
<
/ul>
<
/div><!--html2--></td></tr></table><div class='postcolor'><!--html3-->
y este es el fragmento de la hoja de estilos que aplica el menú:
#barra_izq #menu {
position: absolute;
height: auto;
width: auto;
left: 1px;
top: 70px;
margin: 0px;
padding: 0px;
}
#barra_izq #menu ul {
list-style:none;
margin: 0px;
padding: 0px;
}
#barra_izq #menu #enlace_menu_inicio {
cursor:pointer;
background-image: url(imagenes/InterfazGrafica/enlace_inicio.jpg);
background-repeat: no-repeat;
width: 79px;
height: 19px;
margin: 0px;
padding: 0px;
}
/*...Igual para el resto de los items...*/
#barra_izq #menu span {
display:none;
margin: 0px;
padding: 0px;
}
He probado con modificar el alto de la linea y ajustando los margenes, pero consigo el mismo resultado en IE. ¿Alguien tiene alguna sugerencia?