Menu desplegable CSS

[Pury]

Hola, tengo un problema haciendo un desplegable en un menu ya hecho.
Tengo el siguiente codigo:

Código CSS:

#header #navigation {
    width: 1000px;
    clear: both;
    float: none;
    overflow: hidden;
    background-image: url(navigati.jpg);
    background-repeat: repeat-x;
    background-position: right bottom;
    padding-bottom: 7px;
}
#header #navigation li {
}
#header #navigation li a {
    text-decoration: none;
    color: #E4E4E4;
    background-image: url(navigatj.jpg);
    background-repeat: no-repeat;
    background-position: 0 -120px;
    padding-right: 25px;
    padding-left: 25px;
    margin-top: 13px;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    height: 26px;
    padding-top: 4px;
    text-shadow: 1px 1px #444;
    white-space: nowrap;
    display: block;
    float: left;
}
#header #navigation li a:hover {
    text-decoration: none;
    color: #FFF;
    background-position: 0 0;
    height: 25px;
    padding-top: 5px;
}
#header #navigation li.end {
}
#header #navigation li.end a {
    background-image: url(navigati.png);
    height: 30px;
    background-position: 0px 0px;
    font-size: 14px;
    padding-top: 13px;
    margin-top: 0px;
    width: 256px;
    padding-right: 0px;
    padding-left: 0px;
    text-align: center;
    color: #FCE9EA;
    text-shadow: 1px 1px #8D1018;
}
#header #navigation li.end a:hover {
    background-position: -256px 0px;
    height: 29px;
    padding-top: 14px;
}
 

Eso anda bien, es un menu simple sin desplegable, pero al querer agregarle el desplegable no anda, es decir el menu simple sigue andando bien pero el desplegable no se ve, lo que le agregue fue esto:

Código CSS:

#header #navigation ul {
    display: none; 
    background: #cac99e;
    padding: 5px 0;
    position: absolute; 
    margin: 42px -125px;
}
#header #navigation ul:hover {
    display: block;
}
 

El codigo HTML es este:

Código HTML:

<ul id="navigation">
   <li><a href="index.html">Inicio</a></li>
   <li><a href="servicios.html">Servicios</a>
      <ul>
         <li><a href="serv1.html">Servicio 1</a></li>
      </ul>
   </li>
   <li><a href="contacto.php">Contacto</a></li>
</ul>
 

Debe ser alguna tonteria, pero no se mucho de CSS, y esto es lo unico que quiero hacer por ahora, se que hay muchos tutoriales pero no puedo implementarlo en este caso... cuando disponga de mas tiempo aprendere mas, pero por el momento alguien me puede echar una maano? se lo agradeceria mucho!

gracias desde ya, saludos

[Alejandrogm]

Ya tienes el javascript para que funcione tu desplegable ?

[saul123]

Hola

Por que no esas jquery , o te dejo aqui dos ejemplos , espero que te sirva de algo

Ejemplo de menu desplegable con cssVer ejemplo

Menu desplegable con jqueryVer ejemplo aqui.

si necesitas ayuda puedes contactar conmigo

[Pury]

Iniciado por Alejandrogm

Ya tienes el javascript para que funcione tu desplegable ?

El tutorial que encontre no decia nada de javascript
Igualmente ya lo solucione!

Como dijo saul123 use jquery y con ayuda de otro tutorial lo he conseguido ,

gracias!