[Programación]Menú desplegable con CSS 2.0
Horacio Castellini
horacio9573 en yahoo.com.ar
Vie Sep 20 16:42:17 ART 2013
Holas... he tratado de hacer un menú desplegable con una hoja de
estilo, pero cuando coloco el estilo... en clase nav...
.nav li, ul {
display: none;
position: absolute;
min-width: 140px;
}
puf! se desaparece y no responde a la receta que da youtube... si
alguien me da una mano a donde joraca está el error... acá mando el
código...
<!DOCTYPE HTML>
<html lan="es">
<head>
<title>Menú desplegable</title>
<meta charset="utf-8" />
<style type="text/css">
* {
padding: 0px;
margin: 0px;
}
#header {
margin: auto;
width: 500px;
font-family: Arial, Helvetica, sans-serif;
}
ul, ol {
list-style:none;
}
.nav li, a {
background-color: #000;
color: #fff;
text-decoration: none;
padding: 10px 15px;
display: block;
}
.nav li, a:hover {
background-color: #434343;
}
.nav > li {
float: left;
}
.nav li, ul {
display: none;
position: absolute;
min-width: 140px;
}
.nav li:hover > ul {
display: block;
}
.nav li ul li {
position: relative;
}
.nav li ul li ul {
right: -140px;
top: 0px;
}
</style>
</head>
<body>
<div id="header">
<ul class="nav">
<li><a href="">Inicio</a></li>
<li><a href="">Servicios</a>
<ul>
<li><a href="">Submenú 1</a></li>
<li><a href="">Submenú 2</a></li>
<li><a href="">Submenú 3</a></li>
<li><a href="">Submenú 4</a>
<ul>
<li><a href="">Submenú 1</a></li>
<li><a href="">Submenú 2</a></li>
<li><a href="">Submenú 3</a></li>
<li><a href="">Submenú 4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">Acerca de</a>
<ul>
<li><a href="">Submenú 1</a></li>
<li><a href="">Submenú 2</a></li>
<li><a href="">Submenú 3</a></li>
<li><a href="">Submenú 4</a></li>
</ul>
</li>
<li><a href="">Contacto</a></li>
</ul>
</div>
</body>
</html>
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: <http://lugro.org.ar/pipermail/programacion/attachments/20130920/9872008b/attachment.htm>
Más información sobre la lista de distribución Programacion