saludos,
Quiesiera saber como hago para sobreponer dos divs.
Por que estoy tratando de tener un div abajo con un fondo de una imagen con un degradado vertical con un alto de 443px. y el de arriba otro div con con otro fondo que completa el degradado del otro si es que se extiende el texto hacia abajo.
Gracias de antemano si me pueden ayudar.
ME cree este codigo pero me deja otros 443px abajo de la pagina.
(Y este problema ya me ha pasado varias veces con posiciones relativas, les agradecería si saben como solucionar esto)
Código:
estilos.css
.wrapper {
width: 100%;
text-align: center;
}
.container {
width: 739px;
margin-left:auto;
margin-right:auto;
}
.header {
width: 100%;
height: 49px;
background-image:url(../imagenes/menu_sup.png);
background-repeat: no-repeat;
}
.content {
position:relative;
top:-443px;
width: 100%;
height:443px;
background-image:url(../imagenes/main_top.png);/*esta imagen es la que tiene 443px*/
background-repeat: no-repeat;
}
.content2 {
position:relative;
width: 100%;
background-image:url(../imagenes/main_mid.png);
background-repeat: repeat-y;
top: 443px;
}
.footer {
margin-top:0px;
width: 100%;
background-image:url(../imagenes/main_bot.png);
background-repeat: no-repeat;
}
body {
margin-top: 20px;
padding: 0px;
background-attachment: scroll;
background-image: url(../imagenes/Mplus_bkg.jpg);
background-repeat: repeat-x;
background-position: left top;
height:auto;
}
Código:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/estilos.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="wrapper">
<div class="container">
<div class="header"> </div>
<div class="content2">
<div class="content">
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>asd</p>
<p>das</p>
<p>asd</p>
<p>asd</p>
</div>
</div>
<div class="footer"> </div>
</div>
</div>
</body>
</html>
Y aquí esta la pagina de prueba http://imageboutique.us/prueba_div