Una consultilla que seguro que la sabéis de sobra. Resulta que estoy maquetando un sitio con una estructura de cabecera, contenido y pie (gran descubrimiento xDD), bien, la cabecera es fija y el pie también, lo único que debe autoampliarse es el div de contenido, ya que lleva dentro unos divs de imágenes, y dependiendo de las imágenes que haya se ampliará verticalmente mas o menos.
Dejo una imagen donde se puede ver claramente el objetivo:
El problema que se me presenta es el siguiente, y es que el div pie no reconoce el div contenido y se coloca debajo del div cabecera, como dejo en la siguiente imagen:
Pediría me indicaran cual es el posicionamiento que debo darle a los divs para que esto no ocurra, aquí dejo el código:
********************************************
#cabecera {
height: 100px;
width: 800px;
margin: 0 auto;
background-color: #069;
}
#contenedor {
width: 800px;
margin: 0 auto;
background-color: #FC6;
}
#pie {
height: 20px;
width: 800px;
margin: 0 auto;
background-color: #933;
}
#img {
margin: 10px;
height: 200px;
width: 200px;
background-color: #0C9;
float: left;
}
*******************************************
<body>
<div id="cabecera">contenido de cabecera</div>
<div id="contenedor">
<div id="img">Colocar aquí el contenido para id "img"</div>
<div id="img">Colocar aquí el contenido para id "img"</div>
<div id="img">Colocar aquí el contenido para id "img"</div>
<div id="img">Colocar aquí el contenido para id "img"</div>
<div id="img">Colocar aquí el contenido para id "img"</div>
<div id="img">Colocar aquí el contenido para id "img"</div>
</div>
<div id="pie">contenido del pie</div>
</body>
</html>
********************************************
Muchísimas gracias por adelantado, saludos !!
