Foros del Web - Ver Mensaje Individual - div no se ajusta a la altura del navegador

lvan · #1 (**permalink**) 20/12/2013, 10:06

Buenas tardes amigos. Soy nuevo en la parte de desarrollo web y tengo un problema con una pg web que estoy desarrollando en html5 y css3 , bueno la cosa es que quiero que el div cuyo id es content ocupe todo el espacio vertical hasta el footer, he intentado aplicando height:100% pero no me funciona pero cuando especifico un altura fija como height:500px por alguna razon me funciona.
Aqui tengo el codigo que estoy utilizando y gracias por su ayuda

CSS:

Código CSS:

Ver originalheader{
    border:1px solid #0F0;
    height:40px;
    width:100%;
    position:fixed;
    top:0px;
    background:#000;
}
#content{
    border:1px double #66FFFF;
    width:900px;
    z-index:2;
    margin:40px auto ;
    background:#FFF;
    height:100%;
}
nav{
    border:1px solid #F00;
    background:#666;
}
aside{
    float:left;
    width:250px;
    border:1px dashed #000;
    background:#CF9;
}
article{
    margin-left:250px;
    border:1px dotted #3F0; 
}
footer{
    border:1px groove #0FF;
    position:fixed;
    bottom:0px;
    width:100%;
    background:#000;
}

HTML:

Código HTML:

Ver original<html>
<header>
        cabezera
    </header>
    <div id="content">
        <nav>
            <ul>
                <li>uno</li>
                <li>dos</li>
                <li>trs</li>
                <li>cuatro</li>
                <li>cinco</li>
            </ul>
        </nav>
        <section>
            <aside>menu lateral</aside>
            <article>
                contenido
            </article>
        </section>
    </div>
    <footer>pie de pg</footer>
</html>

\