Foros del Web » Creando para Internet » CSS »

superposicion de 2 capas dentro de otra capa

Estas en el tema de superposicion de 2 capas dentro de otra capa en el foro de CSS en Foros del Web. no encuentro un tutorial que me de una pista de como hacerlo, como dice el titulo necesito superponer dos capas que estan dentro de otra ...
  #1 (permalink)  
Antiguo 05/11/2007, 10:42
Avatar de deet  
Fecha de Ingreso: mayo-2005
Ubicación: Córdoba - Argentina
Mensajes: 269
Antigüedad: 12 años, 7 meses
Puntos: 1
superposicion de 2 capas dentro de otra capa

no encuentro un tutorial que me de una pista de como hacerlo, como dice el titulo necesito superponer dos capas que estan dentro de otra contenedora:

una capa externa que es la contenedora, dentro de ella habría dos capas superpuestas, la mas grande contiene una foto y la mas chica un pequeño texto, simulando una marca de agua que obviamente no tiene transparencia.

Código PHP:
<div style="postition:relative;border:1px #CCCCCC solid; width:155px; height:102px;">
          <
div style="postition:absolute; width:145px; height:92px;"><img src="fotos/thumb/foto.jpg" width="145" height="92" /></div>
        <
div style="postition:absolute; right:20px; top:20px; width:55px;">rs</div>
      </
div

Última edición por deet; 05/11/2007 a las 10:47
  #2 (permalink)  
Antiguo 05/11/2007, 11:04
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Re: superposicion de 2 capas dentro de otra capa

probá con esto:

Código HTML:
#capacontenedora{
  postition:relative;
  border:1px #CCCCCC solid;
  width:155px;
  height:102px;
}
#contenedorfoto{
  postition:absolute;
  width:145px;
  height:92px;
  z-index: 10;
}
#contenedortexto{
  postition:absolute;
  right:20px;
  top:20px;
  width:55px;
  z-index:50;
}
<div id="capacontenedora">
<div id="contenedorfoto">
  <img src="fotos/thumb/foto.jpg" width="145" height="92" />
</div>
<div id="contenedortexto">rs</div>
</div> 
  #3 (permalink)  
Antiguo 05/11/2007, 11:17
Avatar de deet  
Fecha de Ingreso: mayo-2005
Ubicación: Córdoba - Argentina
Mensajes: 269
Antigüedad: 12 años, 7 meses
Puntos: 1
Re: superposicion de 2 capas dentro de otra capa

Código PHP:

#capacontenedora{
  
postition:relative;
  
float:left;
  
text-align:left;
  
width:145px;
  
height:92px;
  
margin-left:5px;
}
#contenedorfoto{
  
position:absolute;
  
width:145px;
  
height:92px;
  
z-index10;
}
#contenedortexto{
  
position:absolute;
  
z-index:50;
  
margin:5px;
  
margin-top:70px;
  
margin-left:130px;
}
<
div id="capacontenedora">
<
div id="contenedorfoto">
  <
img src="fotos/thumb/foto.jpg" width="145" height="92" />
</
div>
<
div id="contenedortexto">rs</div>
</
div

Última edición por deet; 05/11/2007 a las 11:53 Razón: solucionado
  #4 (permalink)  
Antiguo 05/11/2007, 11:53
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Re: superposicion de 2 capas dentro de otra capa

probá con esto:

Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <title>New Document</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
  </head>
  <style>
#capacontenedora{
  postition:relative;
  border:1px #CCCCCC solid;
  width:155px;
  height:102px;
  background-color:#00f;
}
#contenedorfoto{
  postition:absolute;
  width:145px;
  height:92px;
  z-index: 10;
  background-color:#f00;
}
#contenedortexto{
  postition:absolute;
  right:20px;
  top:20px;
  width:55px;
  z-index:50;
  background-color:#0f0;
}
  </style>
  <body>

<div id="capacontenedora">
<div id="contenedorfoto">
  <img src="fotos/thumb/foto.jpg" width="145" height="92" />

<div id="contenedortexto">rs</div>
</div></div>  
  </body>
</html> 
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 13:43.