Foros del Web » Creando para Internet » CSS »

problemas con menu vertical en ie6

Estas en el tema de problemas con menu vertical en ie6 en el foro de CSS en Foros del Web. Tengo un menu vertical que funciona ok, pero al tener mas menus con <ul><LI> en la web se me ha ocurrido incluirlo dentro de un ...
  #1 (permalink)  
Antiguo 02/09/2007, 11:37
 
Fecha de Ingreso: julio-2003
Ubicación: Barcelona
Mensajes: 142
Antigüedad: 14 años, 4 meses
Puntos: 1
Información problemas con menu vertical en ie6

Tengo un menu vertical que funciona ok, pero al tener mas menus con <ul><LI> en la web se me ha ocurrido incluirlo dentro de un div para identidcadr a cada uno de ellos.
Firefox y ie7 son ok., excepto que ahora ie6 no me genera el menu desplegable,

creo que el error está en estas lineas al ponerlas dentro del div
Código:
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
ya que fuera del div , funciona ok
¿alguien me puede echar un cable?

Os dejo todo el codigo


Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Horizontal Drop Down Menus</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="drop_down.js"></script>
<style type="text/css">
body {
	font: normal 11px verdana;
	}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 150px; /* Width of Menu Items */
	border-bottom: 1px solid #ccc;
	}

ul li {
	position: relative;
	}
	
li ul {
	position: absolute;
	left: 149px; /* Set 1px less than menu width */
	top: 0;
	display: none;
	}

/* Styles for Menu Items */
ul li a {
	display: block;
	text-decoration: none;
	color: #777;
	background: #fff; /* IE6 Bug */
	padding: 5px;
	border: 1px solid #ccc;
	border-bottom: 0;
	}

/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */

ul li a:hover { color: #E2144A; background: #f9f9f9; } /* Hover Styles */
		
li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
		
li:hover ul, li.over ul { display: block; } /* The magic */
</style>
<style type="text/css">
body {
	font: normal 11px verdana;
	}

div#nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 150px; /* Width of Menu Items */
	border-bottom: 1px solid #ccc;
	}

div#nav ul li {
	position: relative;
	}
	
div#nav li ul {
	position: absolute;
	left: 149px; /* Set 1px less than menu width */
	top: 0;
	display: none;
	}

/* Styles for Menu Items */
div#nav ul li a {
	display: block;
	text-decoration: none;
	color: #777;
	background: #fff; /* IE6 Bug */
	padding: 5px;
	border: 1px solid #ccc;
	border-bottom: 0;
	}

/* Fix IE. Hide from IE Mac \*/
* html div#nav ul li { float: left; height: 1%; }
* html div#nav ul li a { height: 1%; }
/* End */

div#nav ul li a:hover { color: #E2144A; background: #f9f9f9; } /* Hover Styles */
		
div#nav li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
		
div#nav li:hover ul, li.over ul { display: block; } /* The magic */
</style>


</head>
<body> 


<ul id="nav"> 
  <li><a href="">menu 1</a>
        <ul>
          <li><a href="">sub-menu 1.1</a></li>
          <li><a href="">sub-menu 1.2</a></li>
        </ul>
      </li>
  
  <li><a href="">menu 2</a>
        <ul>
          <li><a href="">sub-menu 2.1</a></li>
          <li><a href="">sub-menu 2.2</a></li>
        </ul>
      </li>
</ul> 

<div id="nav">
<ul> 
   <li><a href="">menu 1</a>
        <ul>
          <li><a href="">sub-menu 1.1</a></li>
          <li><a href="">sub-menu 1.2</a></li>
        </ul>
      </li>
  
  <li><a href="">menu 2</a>
        <ul>
          <li><a href="">sub-menu 2.1</a></li>
          <li><a href="">sub-menu 2.2</a></li>
        </ul>
      </li>
  </ul> 

</DIV>

</body>
</html>

Última edición por tocalasam; 02/09/2007 a las 15:13
  #2 (permalink)  
Antiguo 04/09/2007, 09:25
 
Fecha de Ingreso: septiembre-2006
Mensajes: 12
Antigüedad: 11 años, 2 meses
Puntos: 0
Re: problemas con menu vertical en ie6

Tengo el mismo problema: menú desplegable con css que se ve perfecto en ie7 y firefox pero no en ie6. Alguien nos puede ayudar?

Muchas gracias
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




La zona horaria es GMT -6. Ahora son las 01:11.