Foros del Web » Creando para Internet » CSS »

Menú con submenu en CSS

Estas en el tema de Menú con submenu en CSS en el foro de CSS en Foros del Web. Gente es mi primer post y tengo un problema con los CSS en un menu... Resulta tengo una web creada con DIV (encabezado, menu, cuerpo ...
  #1 (permalink)  
Antiguo 02/05/2009, 10:28
 
Fecha de Ingreso: mayo-2009
Mensajes: 31
Antigüedad: 8 años, 7 meses
Puntos: 1
Menú con submenu en CSS

Gente es mi primer post y tengo un problema con los CSS en un menu... Resulta tengo una web creada con DIV (encabezado, menu, cuerpo y pie) y necesito crear un menu con submenu en algunos de ellos para mostrar los demás archivos que necesito... El menu que hice funciona perfectamente en un archivo nuevo (sin DIV's) el cual es código de html es este.

<ul class="menu">
| <li><a href="index.html" target="_self">Inicio</a></li>
| <li><a href="#">Animación 3D</a></li>
<ul>
<li><a href="anim1.html" target="carga">Album 1</a></li>
</ul>
| <li><a href="#">Dis vectorial</a></li>
<ul>
<li><a href="disv1.html" target="carga">Album 1</a></li>
</ul>
| <li><a href="#">Diseño Web</a></li>
<ul>
<li><a href="disw1.html" target="carga">Album 1</a></li>
</ul>
| <li><a href="#">Edi Fotografía</a></li>
<ul>
<li><a href="edif.html" target="carga">Album 1</a></li>
</ul>
| <li><a href="#">Fotografía</a></li>
<ul>
<li><a href="foto1.html" target="carga">Album 1</a></li>
<li><a href="foto1.html" target="carga">Album 2</a></li>
<li><a href="foto1.html" target="carga">Album 3</a></li>
</ul>
| <li><a href="otros.html" target="_self">Otros</a></li>
| <li><a href="contacto.html" target="_self">Contacto</a></li> |
</ul>

Y este el código en CSS

a{
color: #000;
text-decoration: none;
}

#menu a:hover{
background-color: #666;
color: #FFF;
}


ul.menu
{
list-style:none;
}
ul.menu li
{
position:relative;
width:70px;
}
ul.menu ul
{
position:absolute;
left:30px;
top:-1px;
display:none;
list-style:none;
}
ul.menu li:hover > ul
{
display:block;
}

ul.menu> li > ul
{
position:absolute;
left:-41px;
top:19px;
display:none;
list-style:none;
}
ul.menu > li
{
display:inline;
}

Este es para el archivo en una hoja nueva de html... Ahora anexo mi código CSS que utilizo en las páginas, el cual me configura los DIV's en el navegador...

body{
font-family: verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: justify;
background-image: url(imagenes/background.jpg);
background-position: center;
margin: 0;
}

a{
color: #000;
}

#contenedor{
width: 650px;
height: 620px;
margin-left: auto;
margin-right: auto;
background-color: #FFF;
}

#encabezado{
width: 650px;
height: 100px;
}

#menu{
width: 650px;
height: 15px;
text-align: center;
background-image: url(imagenes/menu.jpg);
}

#menu a{
text-decoration: none;
}

#menu a:hover{
background-color: #000;
color: #FFF;
}

#cuerpo{
width: 650px;
height: 490px;
}

/*El pie de página*/

#pie{
width: 650px;
height: 15px;
}

.pie{
text-align: center;
font-size: 10px;
}

No se si quizá algo en el código principal de las páginas entra en conflicto con e código del menu y no funciona ó hay que modificar algo del código del menu para que funcione perfectamente... El problema es me aparece el submenu pero al querer posicionar el puntero sobre la opción se desaparece y tampoco queda con color...

Espero alguien me pueda ayudar ya que lo necesito para poder terminar la web y no buscar otra alternativa...
  #2 (permalink)  
Antiguo 03/05/2009, 01:20
 
Fecha de Ingreso: mayo-2009
Mensajes: 7
Antigüedad: 8 años, 7 meses
Puntos: 0
Respuesta: Menú con submenu en CSS

bueno amigo yo no podria decirte si algo tiene conflicto o si otra cosa esta mal pues no tengo muchos conocimientos de HTML ni CSS


pero dime, el menu que estas armando es algo como este:
img161.imageshack.us/img161/1080/menuq.png

en la imagen no se ve el puntero del mouse pero si al darle en Inicio se despliegan los botones de Subinicio e igual en los demas botones (Foro, etc)

ese menu lo saque de un Theme de foros SMF que descargue, entonces si te sirve te puedo pasar los archivos necesarios ya sea para que uses ese menu o bien para que lo compares con el tuyo y asi puedas ver que te falta o que te sobra



Saludos
  #3 (permalink)  
Antiguo 03/05/2009, 05:21
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Menú con submenu en CSS

Hola:

Échale un vistazo a este ejemplo, quizá te sirva.

Saludos.

  #4 (permalink)  
Antiguo 03/05/2009, 13:09
 
Fecha de Ingreso: mayo-2009
Mensajes: 31
Antigüedad: 8 años, 7 meses
Puntos: 1
Respuesta: Menú con submenu en CSS

Cita:
Iniciado por ChaRLy_cmjcla Ver Mensaje
bueno amigo yo no podria decirte si algo tiene conflicto o si otra cosa esta mal pues no tengo muchos conocimientos de HTML ni CSS


pero dime, el menu que estas armando es algo como este:
img161.imageshack.us/img161/1080/menuq.png

en la imagen no se ve el puntero del mouse pero si al darle en Inicio se despliegan los botones de Subinicio e igual en los demas botones (Foro, etc)

ese menu lo saque de un Theme de foros SMF que descargue, entonces si te sirve te puedo pasar los archivos necesarios ya sea para que uses ese menu o bien para que lo compares con el tuyo y asi puedas ver que te falta o que te sobra


Saludos
Si asi es el menú que intento crear, ya que tengo algunos links donde se muestran varias páginas secundarias...

Gracias
  #5 (permalink)  
Antiguo 03/05/2009, 13:13
 
Fecha de Ingreso: mayo-2009
Mensajes: 31
Antigüedad: 8 años, 7 meses
Puntos: 1
Respuesta: Menú con submenu en CSS

Cita:
Iniciado por jomaruro Ver Mensaje
Hola:

Échale un vistazo a este ejemplo, quizá te sirva.

Saludos.

Gracias, ya descargue el archivo, ahora espero me funcione pero con los parametros que yo tengo preestablecidos con la página (tamaño fuente, tipo letra y demás)

Gracias por el aporte ya les estaré comentando!!!
  #6 (permalink)  
Antiguo 03/05/2009, 14:35
 
Fecha de Ingreso: mayo-2009
Mensajes: 7
Antigüedad: 8 años, 7 meses
Puntos: 0
Respuesta: Menú con submenu en CSS

bueno yo igual te comparto los archivos del menu de la imagen que te puse arriba

Descarga:
mediafire.com/download.php?u2yqmjwmwnx
  #7 (permalink)  
Antiguo 03/05/2009, 17:12
 
Fecha de Ingreso: mayo-2009
Mensajes: 31
Antigüedad: 8 años, 7 meses
Puntos: 1
De acuerdo Respuesta: Menú con submenu en CSS

Cita:
Iniciado por ChaRLy_cmjcla Ver Mensaje
bueno yo igual te comparto los archivos del menu de la imagen que te puse arriba

Descarga:
mediafire.com/download.php?u2yqmjwmwnx

Gracias... ya les comento como me fue con los archivos!!! De antemano se les agradece
  #8 (permalink)  
Antiguo 04/05/2009, 13:10
 
Fecha de Ingreso: mayo-2009
Mensajes: 31
Antigüedad: 8 años, 7 meses
Puntos: 1
Respuesta: Menú con submenu en CSS

Otro pequeño problema y si alguno puede darme respuesta rápida....
Tengo el menu listo y tengo 5 DIV's... uno principal y dentro del principal 4 más (encabezado, menu, cuerpo y pie).
Al organizar el menu en el div del menu, el submenu queda debajo del DIV cuerpo (este DIV contiene una pelicula flash), como puedo hacer que el DIV menu quede encima del DIV cuerpo y el SWF???
  #9 (permalink)  
Antiguo 04/05/2009, 13:28
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Menú con submenu en CSS

a la pelicula flash colocale esto:

Código:
<param name="wmode" value="transparent" />
__________________
WFC
codigo82
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 09:18.