Foros del Web » Creando para Internet » CSS »

Propiedad z-index

Estas en el tema de Propiedad z-index en el foro de CSS en Foros del Web. Hola, tengo un problema: Pongo en el estilo de la capa1: z-index:1 y en la capa2: z-index:2 pero no se ve bien. En teoria la ...
  #1 (permalink)  
Antiguo 18/02/2007, 15:36
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Propiedad z-index

Hola, tengo un problema:

Pongo en el estilo de la capa1: z-index:1

y en la capa2: z-index:2

pero no se ve bien.

En teoria la capa2 se tendria que ver por encima no??


Hay que darle algun estilo mas???

Lo estoy tratando hacer en IE.

Saludos.
  #2 (permalink)  
Antiguo 18/02/2007, 16:44
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Propiedad z-index

Al menos deberían tener un position (relative o absolute), creo.
Pon si puedes el código para verlo.

Mikel.
  #3 (permalink)  
Antiguo 19/02/2007, 08:36
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Re: Propiedad z-index

ahi va el codigo:

Código HTML:
<div id="contenido_cabecera" class="contenido_cabecera">
	<div id="panel_control">
		<a href="javascript:aparecer('#acceso')">
		Panel de Control
		<img src="img/acceso.gif" alt="Acceder" />
		</a>
             </div>
	<div id="panel_control_debajo">
						
	</div>
							
</div> 
y el CSS:

Código PHP:
.contenido_cabecera{
positionrelative;
width:471px;
background-imageurl("C:\AppServ\www\steel\img\a_01.gif");
background-repeatno-repeat;
height:39px;
padding:0;
float:left;
z-index3;
}
#panel_control{
padding15px 50px 0 0;
z-index:2;
float:left;
border:1px solid green;

}
#panel_control_debajo{
position:absolute;
margin-top:4px;
width:10%;
background-color:#E0E0E0;
border:2px solid red;
border-right:0;
height:31px;
z-index1;
margin-left:100px;
}
#panel_control img{
border:0;


Saludos.
  #4 (permalink)  
Antiguo 19/02/2007, 09:46
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Propiedad z-index

Como te decía, si quieres que la capa que tienes en position: absolute (#panel_control_debajo), se meta debajo de la que pones después (#panel_control), deberás dar a esta position:relative;.

#panel_control{
padding: 15px 50px 0 0;
z-index:2;
float:left;
border:1px solid green;
position: relative;
}

Mikel.
  #5 (permalink)  
Antiguo 19/02/2007, 09:53
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Re: Propiedad z-index

Quiero que se me meta debajo de contenido_cabecera.


Saludos.
  #6 (permalink)  
Antiguo 19/02/2007, 11:29
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Propiedad z-index

Pero así no es posible, porque tal y como tienes el código, está dentro de "contenido_cabecera", y no podría estar debajo de su propio contenedor. Podría estar debajo de otras "hermanas" en el contenedor, pero no debajo de éste.

En ese caso, con la css que tienes te bastaría con cambiarla de sitio. En lugar de tenerla aquí:

Código:
<div id="contenido_cabecera" class="contenido_cabecera">
<div id="panel_control"><a href="javascript:aparecer('#acceso')">Panel de Control
<img src="img/acceso.gif" alt="Acceder" /></a></div>
<div id="panel_control_debajo"></div>
</div>
podrías ponerla aquí:

Código:
<div id="panel_control_debajo"></div>
<div id="contenido_cabecera" class="contenido_cabecera">
<div id="panel_control"><a
 href="javascript:aparecer('#acceso')">Panel de Control<img
 src="img/acceso.gif" alt="Acceder" /></a></div>
</div>
y así creo que sí quedará debajo sin tocar tu css de como está.

Otra cosa: no sé lo has visto en explorer 6, pero se te marcha a la derecha. Creo que lo puedes solucionar cambiando el margin-left: 100px; por left: 100px; en su selector:

#panel_control_debajo{
position:absolute;
margin-top:4px;
width:10%;
background-color:#E0E0E0;
border:2px solid red;
border-right:0;
height:31px;
z-index: 1;
left:100px;
}

Mikel.
  #7 (permalink)  
Antiguo 19/02/2007, 17:02
 
Fecha de Ingreso: enero-2007
Mensajes: 405
Antigüedad: 10 años, 11 meses
Puntos: 3
Re: Propiedad z-index

Graciasss!!!!

Funciona perfecto.
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 21:00.