(snippet) Sticky Footer HTML/CSS

Written by Samuel de Ancos

Paseando por la red , he encontrado un interesante recorte para implementar un sticky footer, esto es, un pie de pagina que se pega al fondo de la ventana aunque el contenido no llegue a llenarlo.

CSS

html, body {height: 100%;}

#wrapper1 {min-height: 100%;}

#wrapper2 {
  overflow:auto;
  padding-bottom: 16.5em;   /* must be same height as the footer */
}

#footer {
  margin: -16.5em 0 0 0; /* negative value of footer height */
  height: 16.5em;
}

HTML

<div id="wrapper1"/>;
  <div id="wrapper2"><div>;
<div>;
<div id="footer">FOOTER<div>;