Foros del Web » Creando para Internet » CSS »

Posicionar un div delante de otro

Estas en el tema de Posicionar un div delante de otro en el foro de CSS en Foros del Web. Hola, queria consultarlos por el siguiente problema. Tengo una web con 2 divs que se superponen y queria establecer que uno este por delante del ...
  #1 (permalink)  
Antiguo 14/03/2011, 15:45
 
Fecha de Ingreso: junio-2010
Mensajes: 108
Antigüedad: 7 años, 6 meses
Puntos: 2
Posicionar un div delante de otro

Hola, queria consultarlos por el siguiente problema. Tengo una web con 2 divs que se superponen y queria establecer que uno este por delante del otro. a los dos los tengo ubicados con css, pero uno me pisa al otro y lo tapa (aunque son png transparentes)...

link


el codigo es el siguiente:


Código HTML:
Ver original
  1. .centered {
  2.   position:absolute;
  3.   top: 50%;
  4.   left: 50%;
  5.   margin-top: -423px;
  6.   margin-left: -428px;
  7.   background-color: white;
  8.   color: white;
  9. }
  10. .right {
  11.   position: absolute;
  12.   top: 0%;
  13.   left: 100%;
  14.   margin-top: 0px;
  15.   margin-left: -207px;
  16.   background-color: white;
  17.   color: white;
  18.   visibility:visible;
  19.  
  20.  
  21. }
  22. -->
  23. </style></head>
  24.  
  25. <div class="left">
  26. <img src="images/en-construccion.png" width="207" height="207" border="0" class="right"/></div>
  27.  
  28. <div class="centered">
  29. <img src="images/bgrupo.png" width="847" height="656" border="0" usemap="#Map" />
  30.  
  31. <map name="Map" id="Map">
  32.   <area shape="rect" coords="131,548,278,618" href="http://www.astridygaston.com/web/intro.php" target="_blank" />
  33.   <area shape="rect" coords="284,548,440,617" href="http://www.aygcatering.com.ar/" target="_blank" />
  34.   <area shape="rect" coords="441,547,550,621" href="http://www.belindacafe.com.ar/" target="_blank" />
  35.   <area shape="rect" coords="551,541,648,617" href="http://www.torestaurant.com/" target="_blank" />
  36. </map>
  37. </div>


Alguna idea?
  #2 (permalink)  
Antiguo 14/03/2011, 15:58
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: Posicionar un div delante de otro

Puedes controlar quién solapa a quién usando la propiedad z-index. Los valores más altos entre elementos "hermanos" (incluidos dentro de la misma etiqueta al mismo nivel) se superponen a los z-index de menor valor.
Aunque el fondo de los elementos sea una imagen transparente, al usar un color de fondo estás ocultando debajo todas las capas o elementos con un z-index inferior.
Salvo que se indique otra cosa en el css, las etiquetas que aparecen más abajo en el HTML ocultan a las anteriores en caso de solapamiento (hablando de etiquetas al mismo nivel).
  #3 (permalink)  
Antiguo 14/03/2011, 16:02
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Posicionar un div delante de otro

Recuerda que si tus imagenes son png y lo estas viendo en IE6, la transparencia no te funcionará
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr

Etiquetas: ubicar
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 08:47.