Foros del Web » Creando para Internet » HTML »

Problema con menu no visible en IE

 Estas en el tema de Problema con menu no visible en IE en el foro de HTML en Foros del Web. Hola chicos, tengo un pequeño problema con una web que estoy haciendo. Resulta que tengo un menu en css que en mozilla se visualiza perfectamente ...
  #1 (permalink)  
Antiguo 29/06/2009, 09:28
 
Fecha de Ingreso: febrero-2008
Mensajes: 28
Antigüedad: 17 años
Puntos: 0
Problema con menu no visible en IE
Hola chicos, tengo un pequeño problema con una web que estoy haciendo.
Resulta que tengo un menu en css que en mozilla se visualiza perfectamente pero en IE no aparece.
Si alguien me pudiese decir cual puede ser el fallo y como solucionarlo...llevo casi 1 semana entera mirando pero no consigo hacerlo, y es lo unico que me queda por terminar de la web xD

La plantilla esta hecha con dreamweaver y este es el codigo junto al css usado para el menu. En rojo lo que no se visualiza en ie que es el codigo del menu

Cita:
<html>
<head>
<link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />
<title>ARPROSA</title>
<meta http-equiv="Content-Type" content="text/html;">
<link rel="stylesheet" href="menu.css" type="text/css" />
<!--[if IE 6]><style>#menu ul li.nivel1 {margin-bottom:-1px}</style><![endif]-->
<!--[if IE 7]><style>#menu ul li.nivel1 {margin-bottom:-2px}</style><![endif]-->
</head>
<body bgcolor="#ffffff">
<td height="50" width="900" align="center"><img src="images/spacer.gif" width="900" height="50" border="0"></td>
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="900" height="576" style="border-collapse: collapse" bordercolor="#111111">
<!-- fwtable fwsrc="Untitled" fwbase="index.gif" fwstyle="Dreamweaver" fwdocid = "742308039" fwnested="0" -->
<tr>
<td height="1" width="183"><img src="images/spacer.gif" width="183" height="1" border="0"></td>
<td height="1" width="20"><img src="images/spacer.gif" width="18" height="1" border="0"></td>
<td height="1" width="21"><img src="images/spacer.gif" width="21" height="1" border="0"></td>
<td height="1" width="45"><img src="images/spacer.gif" width="4" height="1" border="0"></td>
<td height="1" width="585"><img src="images/spacer.gif" width="355" height="1" border="0"></td>
<td height="1" width="22"><img src="images/spacer.gif" width="22" height="1" border="0"></td>
<td height="1" width="17"><img src="images/spacer.gif" width="17" height="1" border="0"></td>
<td height="1" width="7"><img src="images/spacer.gif" width="1" height="1" border="0"></td>
</tr>

<tr>
<td height="1" width="183"><img name="index_r1_c1" src="images/arriba.gif" width="183" height="93" border="0"></td>
<td colspan="6" bgcolor="#FFFFFF" valign="top" height="1">
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#111111" width="104%" id="AutoNumber2" height="88">
<tr>
<td height="88" bgcolor="#FFFFFF" style="border-style: none; border-width: medium">
<p align="center"><a href="index.html"><img src="images/cabecera.JPG" name="cabecera" width="472" height="88" border="0" id="cabecera"></a></td>
</tr>
</table>
</td>
<td height="1" width="7"><img src="images/spacer.gif" width="1" height="93" border="0"></td>
</tr>
<tr>
<td rowspan="3" height="47" valign="top" width="183"><img name="index_r2_c1" src="images/abajo.gif" width="183" height="152" border="0"></td>
<td colspan="6" bgcolor="#ffffff" valign="top" height="13"></td>
<td height="13" width="7"><img src="images/spacer.gif" width="1" height="13" border="0"></td>
</tr>
<tr>
<td rowspan="6" bgcolor="#ffffff" valign="top" height="173" width="20"></td>
<td height="21" width="21"><img name="index_r3_c3" src="images/index_r3_c3.gif" width="21" height="21" border="0"></td>
<td colspan="2" bgcolor="#990000" valign="top" height="21"></td>
<td height="21" width="22"><img name="index_r3_c6" src="images/index_r3_c6.gif" width="22" height="21" border="0"></td>
<td rowspan="6" bgcolor="#ffffff" valign="top" height="173" width="17"></td>
<td height="21" width="7"><img src="images/spacer.gif" width="1" height="21" border="0"></td>
</tr>
<tr>
<td rowspan="3" bgcolor="#990000" valign="top" height="121" width="21"></td>
<td height="115" colspan="2" rowspan="2" valign="top" bordercolor="#DBEAF9" bgcolor="#FFE8E8">
<table width="628" height="392" border="0">
<tr>
<td width="304"><div align="center"><img src="images/DSC04264.JPG" width="295" height="178"></div></td>
<td width="314">&nbsp;</td>
</tr>
<tr>
<td height="195">&nbsp;</td>
<td><p><img src="images/DSC04266.JPG" width="310" height="194"></p>
</td>
</tr>
</table>
<p style="margin: 5"></td>
<td rowspan="2" bgcolor="#990000" valign="top" height="115" width="22"></td>
<td height="118" width="7"><img src="images/spacer.gif" width="1" height="118" border="0"></td>
</tr>
<tr>
<td rowspan="4" bgcolor="#ffe8e8" valign="top" height="139" width="183">
<div align="center">

<table width="78%" height="24" border="1" cellpadding="0" cellspacing="0" bordercolor="#111111" id="AutoNumber1" style="border-collapse: collapse; border-width: 0">
<tr>
<div id="menu" align="left">
<ul>
<li class="nivel1 primera"><a href="#" class="nivel1">Opción 1</a>

<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 1<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 1.1</a></li>
<li><a href="#">Opción 1.2</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Opción 2</a>

<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 2<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 2.1</a></li>
<li><a href="#">Opción 2.2</a></li>
<li><a href="#">Opción 2.3</a></li>
<li><a href="#">Opción 2.4</a></li>
<li><a href="#">Opción 2.5</a></li>

</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Opción 3</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 3<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 3.1</a></li>
<li><a href="#">Opción 3.2</a></li>
<li><a href="#">Opción 3.3</a></li>

</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Opción 4</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 4<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 4.1</a></li>
<li><a href="#">Opción 4.2</a></li>
<li><a href="#">Opción 4.3</a></li>

<li><a href="#">Opción 4.4</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="nivel1"><a href="#" class="nivel1">Opción 5</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 5<table class="falsa"><tr><td><![endif]-->
<ul>
<li class="primera"><a href="#">Opción 5.1</a></li>
<li><a href="#">Opción 5.2</a></li>

<li><a href="#">Opción 5.3</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
</tr>
</table>

</div>
</td>
<td height="275" width="7"><img src="images/spacer.gif" width="1" height="102" border="0"></td>
</tr>
<tr>
<td rowspan="2" colspan="2" bgcolor="#990000" valign="top" height="22"></td>
<td rowspan="2" height="22" width="22"><img name="index_r6_c6" src="images/index_r6_c6.gif" width="22" height="22" border="0"></td>
<td height="6" width="7"><img src="images/spacer.gif" width="1" height="6" border="0"></td>
</tr>
<tr>
<td height="16" width="21"><img name="index_r7_c3" src="images/index_r7_c3.gif" width="21" height="16" border="0"></td>
<td height="16" width="7"><img src="images/spacer.gif" width="1" height="16" border="0"></td>
</tr>
<tr>
<td colspan="4" bgcolor="#ffffff" valign="top" height="15"></td>
<td height="15" width="7"><img src="images/spacer.gif" width="1" height="15" border="0"></td>
</tr>
<tr>
<td colspan="7" bgcolor="#990000" valign="top" height="16">
<p align="center"><b><font face="Arial" size="1" color="#0066CC">Art&iacute;culos de protecci&oacute;n S.A. --- As Pontes </font></b></td>
<td height="16" width="7"><img src="images/spacer.gif" width="1" height="16" border="0"></td>
</tr>
</table>
</center>
</div>
</body>
</html>

MENU

Cita:
* { margin: 0px;
padding: 0px; outline: 0;
}

#menu { text-align: center;
font-size: 0.7em;
width: 184px;
margin: 0px;
}
#menu ul { list-style-type: none;
}
#menu ul li.nivel1 {
width: 184px;
}
#menu ul li.primera { border-top: solid 1px #FFF;
}
#menu ul li a {display: block;
text-decoration: none;
color: #fff;
background-color: #990000;
border: solid 1px #fff;
border-top: none;
padding: 8px;
position: relative;
}
#menu ul li:hover {position: relative;
background-color: #990000;
color: #000;
}
#menu ul li a:hover, #menu ul li:hover a.nivel1 {background-color: #990000;
color: #000;
position: relative;
}
#menu ul li a.nivel1 {display: block!important;display: none;
position: relative;
}
#menu ul li ul {display: none;
}
#menu ul li a:hover ul, #menu ul li:hover ul {display: block;
position: absolute;left: 184px;top:-1px!important;top: -31px;
}
#menu ul li ul li a {width: 184px;
background-color: #990000;
color: #000;
}
#menu ul li ul li a:hover {position: relative;
background-color: #990000;
color: #FFF;
}
table.falsa {border-collapse:collapse;
border:0px;
float: left;
position: relative;
}
  #2 (permalink)  
Antiguo 29/06/2009, 17:25
Avatar de deirdre  
Fecha de Ingreso: mayo-2009
Mensajes: 690
Antigüedad: 15 años, 8 meses
Puntos: 45
Respuesta: Problema con menu no visible en IE
Sobrevolando rápida y superficialmente tu código: le falta el doctype, después de <body> empiezas con un <td> (<td> es parte de una tabla, y la tabla no existe) y no aclaras cuál versión de ie es la que causa problemas...

Ve arreglando cosas y nos dices.

Bye
  #3 (permalink)  
Antiguo 29/06/2009, 19:08
 
Fecha de Ingreso: junio-2009
Mensajes: 47
Antigüedad: 15 años, 7 meses
Puntos: 1
Respuesta: Problema con menu no visible en IE
El HTML tiene un monton de errores como los que ya mencionaron
  #4 (permalink)  
Antiguo 30/06/2009, 05:50
 
Fecha de Ingreso: febrero-2008
Mensajes: 28
Antigüedad: 17 años
Puntos: 0
Respuesta: Problema con menu no visible en IE
Hola, gracias por las respuetas.
El codigo esta hecho con el dreamweaver, y fue lo que me pasaron, yo solo añadi la parte php que es en la que tengo "algo" de conocimientos, y que son pocos.
El problema lo da con IE 7
  #5 (permalink)  
Antiguo 30/06/2009, 10:25
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 20 años, 4 meses
Puntos: 10
Respuesta: Problema con menu no visible en IE
Hola diablonigromante

Tal como te han comentado el código está "hecho unos zorros" y tal como lo tienes te dará muchos problemas.

Para solucionar la invisibilidad del menú en ie7 sólo tienes que añadirle un doctype, por ejemplo:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
Esto te resuelve el menu en ie7, pero debes considerar arreglar todo el conjunto porque, por ejemplo, en ie6 el menú no se estructura tal como tienes el código.

También es necesario que lo pruebes en otros navegadores.

Saludos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 17:03.