Ver Mensaje Individual
  #1 (permalink)  
Antiguo 03/02/2012, 22:27
yuo2
 
Fecha de Ingreso: diciembre-2008
Ubicación: PERU
Mensajes: 294
Antigüedad: 16 años
Puntos: 23
Pregunta sobre pie pagina



Pues siempre he sido de la costumbre de definir el alto del tamaño del cuerpo y luego el pie de pagina.

Pero ahora intente no definir el alto del cuerpo de pagina y ver si el pie de pagina en realidad se posiciona abajo osea en la parte inferior del navegador y no abajo de la capa div del cuerpo y del contenedor.

Es posible que el pie de pagina se posicione en la parte inferior del navegador a pesar que el cuerpo a pesar de no tener altura definida ??


Aqui dejo mi script.

Código CSS:
Ver original
  1. body
  2.     {
  3.     font-family:Arial, Helvetica, sans-serif;
  4.     background-color:#d1d1d1;
  5.     margin:0px auto;
  6.     width:100%;
  7.     height:100%;
  8. }
  9.  
  10. #contenedor {
  11. width:100%;
  12. height:100%;
  13. background-color:#d1d1d1;
  14. }
  15.  
  16. #cabecera{
  17. background-color:#FFFFCC;
  18. width:100%;
  19. height:120px;
  20.  
  21. }
  22.  
  23. #cuerpo{
  24. background-color:#D1D1D1;
  25. width:100%;
  26. height:60%;
  27. float:left;
  28. }
  29.  
  30. #pie
  31. {
  32. color:#FFFFFF;
  33. background-color:#333333;
  34. height:80px;
  35. clear:both;
  36. }


Código HTML:
Ver original
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2. "http://www.w3.org/TR/html4/loose.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <link href="estilo.css" rel="stylesheet" type="text/css" media="screen" charset="utf-8" />
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <title>ejemplo</title>
  7.  
  8. </head>
  9.  
  10.  
  11.  
  12. <div id="contenedor">
  13.  
  14.     <div id="cabecera">
  15.     Cabecita
  16.     </div>
  17.  
  18.     <div id="cuerpo">Cuerpo
  19.     </div>
  20.    
  21. </div>
  22.  
  23. <div id="pie">
  24.  aqui ira el pie de pagina
  25. </div>
  26.    
  27. </body>
  28. </html>