Tema: Maquetar dejando fijo el pie de página
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 03/07/2013, 11:49
nh2006
 
Fecha de Ingreso: diciembre-2006
Mensajes: 213
Antigüedad: 17 años, 4 meses
Puntos: 3
Maquetar dejando fijo el pie de página
Hola amigos,

Necesito maquetar un sitio de como el siguiente: http://activ.com.mx/introduccion-a-m...ries-con-css3/

Tengo un encabezado (header) al borde superior de la ventana y el pie (footer) pegado al borde inferior de la ventana, en medio el contenido y cuando este sobrepasa el alto de contenedor le agrega una barra de desplazamiento vertical.

Código CSS: 
Ver original
  1. header{
  2.     margin: 0 0 1em 0;
  3.     padding: 0.2em 0;
  4.     width: auto;    
  5. }
  6. footer{
  7.     padding: 2.5em 0;
  8.     bottom: 0;
  9.     position: fixed;
  10.     width: 100%;
  11. }
  12.  
  13. #contenido{
  14.       overflow-y:visible;overflow-x:hidden;        
  15. }

El html es similar a lo siguiente:
Código HTML: 
Ver original
  1. <html lang="es">
  2. <head>  
  3. </head>
  4. <body>
  5.      <header>
  6.      </header>
  7.      <article ="contenido">
  8.      </article>
  9.     <footer>
  10.      </footer>
  11. </body>
  12. </html>

No he logrado hacerlo pues cuando el contenido crece demasiado queda oculto por el footer, y si ven el enlace que les pasé, el contenido crece y baja el footer que a la vez está pegado a la parte inferior de la ventana.

Me ayudan con esto por favor?

Desde ya se los agradezco