Foros del Web » Creando para Internet » CSS »

Slide queda por encima de mi menú fijo

Estas en el tema de Slide queda por encima de mi menú fijo en el foro de CSS en Foros del Web. Hola! Estoy haciendo una web (www.fer.es/compas/agm) y me ha surgido un problema, tengo una cabecera fija con un menu, cuando uso el scroll todo el ...
  #1 (permalink)  
Antiguo 16/05/2012, 03:25
 
Fecha de Ingreso: mayo-2012
Mensajes: 7
Antigüedad: 6 años, 1 mes
Puntos: 0
Slide queda por encima de mi menú fijo

Hola!

Estoy haciendo una web (www.fer.es/compas/agm) y me ha surgido un problema, tengo una cabecera fija con un menu, cuando uso el scroll todo el contenido se oculta bajo esa cabecera, pero al pinchar en el apartado "EL CENTRO", el slide de imágenes que hay, queda por encima de mi cabecera en lugar de ocultarse por abajo como el resto del contenido...

Creo que tiene algo que ver con el Z-INDEX, pero he estado probando opciones y no lo he conseguido... No se si tiene una solución fácil o no, pero si alguien me puede echar una mano se lo agradeceré mucho!!

Muchas gracias y un saludo!
  #2 (permalink)  
Antiguo 16/05/2012, 03:47
Avatar de DanielRGB  
Fecha de Ingreso: marzo-2012
Mensajes: 117
Antigüedad: 6 años, 3 meses
Puntos: 18
Respuesta: Slide queda por encima de mi menú fijo

Pues tienes que ver bien si el slider tiene z-index.
Si es así tienes que ver que valor tiene. Y ponerlo inferior al z-index del menu.
Recuerda siempre que debes usar position: relative o absolute.

Por ejemplo.

#menu { position: relative; z-index: 10; float: left; }
#slider { position: relative; z-index: 5; float: left; }
__________________
Yo recomiendo para el hosting - www.cyberneticos.com

"Me encanta cuando los planes salen bien"
Hannibal Smith
  #3 (permalink)  
Antiguo 16/05/2012, 04:14
 
Fecha de Ingreso: mayo-2012
Mensajes: 7
Antigüedad: 6 años, 1 mes
Puntos: 0
Respuesta: Slide queda por encima de mi menú fijo

Gracias Daniel pero sigo en las mismas, hay elementos del slider que tienen un z-index: 1000, yo le pongo a mi cabecera 2000 por ejemplo y sigo en las mismas. He tenido en cuenta lo de que tenga position, pero no consigo que esto quede bien.

El slide llama a una hoja de estilos que es diferente a la de la cabacera, puede tener esto algo que ver?
  #4 (permalink)  
Antiguo 16/05/2012, 08:05
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 8 meses
Puntos: 40
Respuesta: Slide queda por encima de mi menú fijo

Lo que pasa es que no es la barra la que debería tener z-index, es el contendor que tiene a esta, según veo es #arriba, solo ponle a #arriba que tiene position : fixed un z-index: 1001

Código HTML:
Ver original
  1. #arriba {
  2.     position: fixed;
  3.     width: 100%;
  4.     z-index: 1001;
  5. }
__________________
WFC
codigo82
  #5 (permalink)  
Antiguo 16/05/2012, 08:17
 
Fecha de Ingreso: mayo-2012
Mensajes: 7
Antigüedad: 6 años, 1 mes
Puntos: 0
Respuesta: Slide queda por encima de mi menú fijo

Mil gracias willyfc!!
perfecto con lo que me dijiste, mira que era obvio, pero me podía haber estado una semana entera y no habría caido que era a #arriba a quien le tenía que dar el z-index.

Gracias por abrirme los ojos!!!jeje
  #6 (permalink)  
Antiguo 09/11/2012, 06:32
 
Fecha de Ingreso: noviembre-2012
Mensajes: 1
Antigüedad: 5 años, 7 meses
Puntos: 0
Respuesta: Slide queda por encima de mi menú fijo

Yo tengo el mismo problema.
Mi código css es el siguiente:

#slideshow {
margin: 50px auto;
position: relative;
width: 240px;
height: 240px;
padding: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.4);
}

#slideshow > div {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
}

#slideshow2 {
margin: 50px auto;
position: relative;
width: 240px;
height: 240px;
padding: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.4);
}

#slideshow2 > div {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
}

#slideshow3 {
margin: 50px auto;
position: relative;
width: 240px;
height: 240px;
padding: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.4);
}

#slideshow3 > div {

position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
}
#hmenu > li {

display:inline-block;
}


#hmenu > li a{
display:block;
padding:10px 5px;
width:90px;
}

li ul {
position: absolute;
display: none;
}

.sub-menu a {

z-index:1002
display: block;
padding: 10px 5px;
width: 130 px;
}

li:hover ul{
display:block;
}

#menu-wrapper, li ul {

background:url(imagenes/fondomenu.jpg) ;

}

#hmenu {
width: 412px;
margin: 0 auto;
}

#hmenu a {
color:#fff; /* Quitar el subrayado */
text-decoration: none;
font-weigth: bold;
}

#hmenu li:hover { /* CSS cuando aparezca el mouse, que aparezca otro fondo de otro color */
;
background: #a3cd39;
text-shadow: 0 0 2px #000; /* CSS3 Sombra en el texto*/
}

Alguna idea?

Muchísimas gracias de antemano

Etiquetas: menu-fijo, slide, z-index
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 12:39.