Buenas!!
Estoy haciendo una pagina con css y queria poner que el height de la pagina sea 100% lo que hice
Código HTML:
<div id="Contenedor">
<div id="header">
</div>
<div id="content">
</div>
<div id="footer">
</div>
</div>
Código:
html, body {
margin: 0;
padding: 0;
height: 100%;
text-align:center;
}
#Contenedor {
margin:0 auto 0 auto;
padding:0 4px 0 4px;
width:1000px;
height:100%;
text-align:left;
background-color: #FFFFFF;
border-color:#E2E2E2;
border-width:1px;
border-style:solid;
}
#header {
width:1000px;
margin:0 auto 0 auto;
height:94px;
background-color: #2b2b2b;
border-bottom-color:#000000;
border-bottom-width:1px;
border-bottom-style:solid;
}
#content {
width:1000px;
height:auto;
margin:2px auto 2px auto;
background-color: #2b2b2b;
border-bottom-color:#000000;
border-bottom-width:1px;
border-bottom-style:solid;
}
#footer {
width:1000px;
margin:0 auto 0 auto;
height:94px;
background-color: #2b2b2b;
border-bottom-color:#000000;
border-bottom-width:1px;
border-bottom-style:solid;
}
El problema viene en el height de content, tengo contenedor al 100% del navegador y el resto de los divs dentro(no se si me lo recomiendan asi o hacer los divs de una ves sin un contenedor)
el header le puse height de 94 y todo bien por que se que el header nunca va a cambiar de tamaño
pero content no se como ponerle el height, si lo pongo en px y tengo informacion dentro ke sea superior a esos px se sale del div la info y queda del mismo tamaño el div, si lo pongo en % pasa lo mismo entonces lo puse en auto pero si no tiene ningun contenido se queda casi sin altura y el footer se sube y no permanece al final con el tamaño de contenedor y aun asi que acomode el footer al final content si no tiene info y esta en auto se queda muy pequeño.
lo que necesito es una ayuda de:
si en content no hay info mantenga la altura del navegador respetando a header y footer. pero si hay info que content pueda agrandarse sin problemas.
espero que entiendan mi pedido :)
acepto cualquier tipo de sugerencias para ir mejorando en css :)