Problema Menu básico CSS en IE

Iniciado por nikko88, 29 Junio 2012, 16:25 PM

0 Miembros y 1 Visitante están viendo este tema.

nikko88

Buenas, me gustaría saber por qué no consigo visualizar mi menú en Internet Explorer. En todos los demás navegadores se visualiza perfectamente menos en IE... Os dejo el código y a ver si me podeis ayudar. Además, si es que existe, me gustaría saber si hay alguna web dónde aparezcan las principales diferencias en lo que html - css se refiere entre navegadores ya que veo que el menú no es lo único que me varía :(

Aquí va el html del menú:
Código (html4strict) [Seleccionar]

<div id="menuvertical">
  <ul>
    <li class="nivel1 primera"><a href="#" class="nivel1">SOLICITUD TAXI</a>
      <ul>
<li class="primera"><a href="URL del enlace">FORMALIZAR PEDIDO TAXI</a></li>
<li><a href="URL del enlace">CARRERA TAXI</a></li>
      </ul>
    </li>
    <li class="nivel1"><a href="#" class="nivel1">CONTROL TAXI</a>
      <ul>
<li class="primera"><a href="URL del enlace">ALTA NUEVOS TAXIS</a></li>
<li><a href="URL del enlace">LISTADO GENERAL DE TAXIS</a></li>
<li><a href="URL del enlace">MODIFICAR DATOS TAXIS</a></li>
      </ul>
    </li>
    <li class="nivel1"><a href="#" class="nivel1">GESTIÓN DE CAJA</a></li>
  </ul>
</div>


Y aquí el CSS:

Código (html4strict) [Seleccionar]

#menuvertical {
margin-left:17px;
text-align: left;
font-family:arial;
width:100%;
}

#menuvertical ul {
list-style-type: none;
padding:1px;
}

#menuvertical ul li.nivel1 {
width: 162px;
padding-bottom:1px;
}

#menuvertical ul li.primera {
padding-bottom:1px;
}

#menuvertical ul li {
padding-bottom:1px;
margin-bottom:1px;
}

#menuvertical ul li a {
display: block;
text-decoration: none;
color: #000;
background-color: #EBBD26;
border-left: solid 10px #48453E;
border-top: none;
padding: 8px;
position: relative;
}

#menuvertical ul li:hover {
position: relative;
color: #000;
}

#menuvertical ul li a:hover, #menuvertical ul li:hover a.nivel1 {
background-color: #CD9E06;
border-left: solid 17px #48453E;
color: #000;
position: relative;
}

#menuvertical ul li a.nivel1 {
display: block !important;
display: none;
position: relative;
}

#menuvertical ul li ul {
display: none;
}

#menuvertical ul li ul li{
width: 162px;
padding-bottom:1px;
}

#menuvertical ul li a:hover ul, #menuvertical ul li:hover ul {
display: block;
position: absolute;
left: 162px;
top: -1px;
}

#menuvertical ul li ul li a {
background-color: #EBBD26;
border-left: solid 10px #48453E;
color: #000;
}

#menuvertical ul li ul li a:hover {
position: relative;
background-color: #CD9E06;
color: #000;
border-left: solid 15px #48453E;
}


Gracias de antemano.

nikko88

Vale lo he resuelto aun que no se muy bien por qué, al definir el doctype ie si que lo acepta.


nikko88

Pues no lo sé aún la verdad, la mayoría de navegadores me interpretaron correctamente el código sin el doctype, estoy mirándome lo de los quirks modes de los navegadores por curiosidad..