Lo pongo en un solo archivo, todo, html y css.. quitando el resto de adornos que ahora mismo no me importa, ya que lo que no anda bien es el menu...
A ver si así es más fácil ver el problema...
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<style type="text/css">
* { margin: 0px;
padding: 0px;
outline: 0;
}
html, body { width: 100%;}
body {
font-family: Calibri;
}
#menu { text-align: center;
font-size: 0.7em;
width: 962px;
margin: 0px auto;
/*vertical-align: middle;*/
}
#menu ul { list-style-type: none;}
#menu ul li.nivel1 { float: left;
width: 162px;
margin-right: 0px;
}
#menu ul li a {display: block;
text-decoration: none;
color: #fff;
background-color: #44707D; /*Color de fondo del nivel que sea*/
/*border: solid 1px #fff; *//*Color de los bordes de las celdas*/
border-top: solid #ffffff 0px;
border-right: solid #ffffff 1px;
border-bottom: solid #ffffff 0px;
border-left: solid #ffffff 0px;
padding: 8px;
position: relative;
}
/*PARA ASPECTO SIMPLE DEL NIVEL 2*/
#menu ul li.nivel2 a.nivel2 {display: block;
text-decoration: none;
color: #fff;
background-color: #939393; /*Color de fondo del nivel que sea*/
border: solid 1px #fff;
padding: 1px;
position: relative;
margin: 3px;
}
#menu ul li:hover {position: relative;
display: block;
}
#menu ul li a:hover, #menu ul li:hover a.nivel1 {
background-color: #5CC9BA; /*Color sobre nivel1*/
color: #000;
position: relative;
}
/* #menu ul li a.nivel1 {display: block!important;display: none; */
#menu ul li a.nivel1 {display: block;
position: relative;
}
#menu ul li ul {display: none; }
#menu ul li a:hover ul, #menu ul li:hover ul {display: block;
position: absolute;left: 0px;
}
/*NIVEL 2*/
#menu ul li ul li a {width: 200px; /*Aspecto normal - Ancho de las celdas de nivel2*/
padding: 6px 0px 8px 0px;
border-top-color: #000;
}
#menu ul li ul li.nivel2 a.nivel2:hover {border-top-color: #000; /*Aspecto cuando es hover .. Color sobre nivel2*/
position: relative;
background-color: #646464;
color: #fff;
border: solid 1px #fff;
}
/*FIN NIVEL 2*/
table.falsa {border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
</style>
</head >
<body text="#000000" bgcolor="#FFFFFF">
<div id="menu">
<UL>
<LI class="nivel1"><a href="#" TARGET="_self" class="nivel1">la empresa</a>
<UL>
<LI class="nivel2"><a href="vOpcionesMenuxID/633DEA748C5ED6C5C1257830003B58F2?OpenDocument" TARGET="_self" class="nivel2">presentacion</a></LI>
<LI class="nivel2"><a href="vOpcionesMenuxID/163B031766956115C1257830003B6E84?OpenDocument" TARGET="_self" class="nivel2">mision</a></LI>
<LI class="nivel2"><a href="vOpcionesMenuxID/A97F7A16EF2340EBC1257830003B7378?OpenDocument" TARGET="_self" class="nivel2">vision</a></LI>
<LI class="nivel2"><a href="vOpcionesMenuxID/EE4E015945F4DCD4C1257830003B778C?OpenDocument" TARGET="_self" class="nivel2">valores corporativos</a></LI>
<LI class="nivel2"><a href="vOpcionesMenuxID/FF6C0E866A4156F0C1257830003B7E0C?OpenDocument" TARGET="_self" class="nivel2">sectores</a></LI>
</UL>
</LI>
<LI class="nivel1"><a href="$$ViewTemplate for wvNoticiasWeb?Open" TARGET="_self" class="nivel1">noticias</a></LI>
<LI class="nivel1"><a href="wfUnete?Open" TARGET="_self" class="nivel1">unete a nosotros</a></LI>
<LI class="nivel1"><a href="vOpcionesMenuxID/F6D80F21D406421AC1257830003B320F?OpenDocument" TARGET="_self" class="nivel1">intranet</a></LI>
<LI class="nivel1"><a href="vOpcionesMenuxID/CC950127AA0A66EAC1257830003B35C0?OpenDocument" TARGET="_self" class="nivel1">contacto</a></LI>
</UL>
</DIV>
</body>
</html> El validador me dice que el css está bien... ·El documento ha pasado el test: W3C CSS Validator (Level 2.1) Enlace directo"
Sólo 1 error de html... end tag for "HEAD" which is not finished .. </head >, pero no creo que ese sea el problema...