Pie de página abajo del navegador con CSS

CATEGORIA | TUTORIALES | css
23/09/09

pie_pagina_css

Ryant Fait nos presenta un sistema compatible con la mayoría de navegadores para rezliar el típico pie de pagina que se coloca siempre que haya poco contenido en la parte inferior, muy util cuando trabajamos con páginas que no trabajan con todo el alto del navegador.


Contenido del CSS
* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -142px; /* the bottom margin es el valor negativo de la altura del footer */
}
.footer, .push {
height: 142px; /* .push tiene la misma altura que footer */
}

Como podeís ver utiliza 1 contenedor para Header y Content llamado wrapper, justo antes de cerrar wrapper intruduce otro contenedor con la clase .push que es la que nos marcara el espacio que ha de ocupar el footer sistema muy ingenioso y que funciona correctamente, no os olvideis de darle el alto 100% al body y html.

ejemplo:Sticly-Fait

COMPARTIR:
  • Print
  • email
  • Facebook
  • Meneame
  • Twitter

Enlazes Reacionados

2 Comments to Pie de página abajo del navegador con CSS

  1. Adrian's Gravatar Adrian
    07/11/2009 at 8:40 pm | Permalink

    Justo lo que estaba buscando!

    gracias dude!

Dejar un comentario

Puedes usar las siguientes etiquetas HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

PORTFOLIO

cerodeinteres Spiraal Restaurante Japonés Zen BOOK LABELS AYUNTAMIENTO SANT BOI – curso 05 AYUNTAMIENTO SANT BOI ANDREU BRU POWER DRINKS stand feria alimentaria TCHOUKA