A pedido de un colega va este requete-mini-tuto de como hacer que el DIV de pie de página quede en donde debe (al fondo del contenedor).
Supongamos una estructura semántica como la siguiente:
<body>
<div id=»contenedor»>
<div id=»encabezado»></div>
<div id=»contenido»>Contenido de la página</div>
<div id=»pie»>Copyleft 2009</div>
</div>
</body>
Bueno, los estilos para cada parte quedarían así:
html, body {
margin: 0;
padding: 0;
height: 100%;
overflow:hidden;
}
#contenedor {
width: 100%;
height: 100%;
background: #DDD;
position: relative;
}
#encabezado {
width: 100%;
background: #CCC;
position: absolute;
top:0;
height:130px;
}
#contenido {
width: 100%;
overflow: auto;
position: absolute;
top: 130px;
bottom: 40px;
}
#pie {
width: 100%;
background: #CCC;
position: absolute;
bottom: 0;
height: 40px;
}