Foros del Web » Creando para Internet » CSS »

¿Una mano con z-index? No lo puedo hacer funcionar :S

Estas en el tema de ¿Una mano con z-index? No lo puedo hacer funcionar :S en el foro de CSS en Foros del Web. Bueno, estoy haciendo un pequeño sitio, y todavía no estoy muy acostumbrado a las capas vithe y no me funciona el z-index correctamente... (Este es ...
  #1 (permalink)  
Antiguo 21/07/2009, 23:56
 
Fecha de Ingreso: mayo-2008
Ubicación: En la guarida del mal, tratando de conquistar el mundo
Mensajes: 174
Antigüedad: 9 años, 6 meses
Puntos: 2
¿Una mano con z-index? No lo puedo hacer funcionar :S

Bueno, estoy haciendo un pequeño sitio, y todavía no estoy muy acostumbrado a las capas vithe y no me funciona el z-index correctamente...

(Este es una extracción, solo tiene las capas, filas, etcéteras que son relevantes al problema xD)

Código HTML:
<div id="container">
	<table>
		<tr><td>
			<div id="header">Esta es la capa que tiene z-index 2, pero se queda abajo ¬¬</div>
		</td></tr>
		<tr><td>
			<div id="main">
				<div id="image">Esta es la capa que tiene z-index 1 esta se queda arriba =(</div>
			</div>
		</td></tr>
	</table>
</div> 
Espero que entiendan, porque no me funciona :S.
  #2 (permalink)  
Antiguo 22/07/2009, 00:08
 
Fecha de Ingreso: mayo-2007
Mensajes: 348
Antigüedad: 10 años, 6 meses
Puntos: 9
Respuesta: ¿Una mano con z-index? No lo puedo hacer funcionar :S

Nosé, si entiendes "arriba" y "abajo" usando z-index, debido a la forma que tienes tu (X)html no puedes comprobarlo...


z-index es cuando se colocan encima ( arriba ) o debajo ( abajo), parece una tontería pero creo que no lo llegas a entender.


Tu código funciona a la perfección, solo que tienes que poner encima una capa de otra para comprobar si realmente funciona tu z-index:

Te limpié un poco en xhtml para ver tu ejemplo.

Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>Documento sin t&iacute;tulo</title>
  5. <style type="text/css">
  6. div#header {
  7.     position:absolute;
  8.     left:1em; /* para que realmente veas que esta se queda abajo */
  9.     z-index:2;
  10.     background-color:#960;
  11. }
  12.  
  13. div#image {
  14.     position:absolute;
  15.     z-index:1;
  16.     background-color:#CC9999;
  17. }
  18.  
  19.  
  20.  
  21.  
  22. </head>
  23.  
  24. <div id="container">
  25.  
  26.             <div id="header">z-index: 2</div>
  27.  
  28.  
  29.                 <div id="image">z-index: 1</div>
  30.  
  31. </div>
  32. </body>
  33. </html>
__________________
Debian Squeeze rules!
  #3 (permalink)  
Antiguo 22/07/2009, 00:46
 
Fecha de Ingreso: mayo-2008
Ubicación: En la guarida del mal, tratando de conquistar el mundo
Mensajes: 174
Antigüedad: 9 años, 6 meses
Puntos: 2
Respuesta: ¿Una mano con z-index? No lo puedo hacer funcionar :S

Jajajajajaja que tarado que fui xD.
Tenía a la div main con z-index 100 y no me había dado cuenta xD.
Weno, cierro post porque no tiene sentido dejarlo abierto xP.


EDITO: No lo puedo cerrar, algún admin que cierre el post porfavor xD.

Última edición por ZequeZ; 22/07/2009 a las 00:49 Razón: Cerrar el post
  #4 (permalink)  
Antiguo 22/07/2009, 08:10
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: ¿Una mano con z-index? No lo puedo hacer funcionar :S

Hola ZequeZ
Si andas "jugando" con la propiedad z-indez, quizás te sea un poquito útil este tema.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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:52.