El tema del pie de página al final aun cuando no hay mucho contenido ha sido comentado ampliamente.
En
google se ven varios resultados y en general te van a decir esto:
1. El contenedor general debe tener un height del 100%.
2. El pie lo pones fuera del contenedor general y le das una altura fija.
3. Al contenedor le das una margen abajo negativa de igual valor a la altura del pie.
En teoría funciona, pero cuando pruebas con uno y otro navegador tiene sus inconvenientes.
Por ejemplo, yo cierta vez lo hice y todo iba bien, pero en IE el contenedor principal se me "escondía" un poco en la parte de arriba, por la margen negativa y la altura 100% supongo.
Sin embargo te pongo aquí como hacerlo.
Código:
body {
height: 100%;
}
#contenedor {
height: 100%;
min-height: 100%;
margin-bottom: 120px; //Suponiendo que el pie tiene 120px de altura
}
#pie {
height: 120px;
}
Código HTML:
<div id="contenedor">
Aca debería ir el contenido y los demás divs.
</div>
<div id="pie">
Acá el contenido del pie
</div>
Con eso debería bastar, prueba y nos cuentas.
P.D: Me surge una duda, no se que tan semántico sea hacer eso de poner el pie por fuera del contenedor principal.