vorrei creare un layout, come ne ho visti in giro, dove la pagina, anche se senza contenuti, sia alta 100% , cioè tutto lo schermo.

il codice è questo:

<div id="container">
<div id="top">logo</div>
<div id="img">immagine</div>
<div id="contenent">contenuti</div>
<div id="footer">footer</div>
</div>

il CSS questo:

html,body
{
margin: 0;
padding:0;
font-family: arial,sans-serif;
font-size: 11px;
text-align:center;
}

div#container
{
margin: auto;
text-align: left;
line-height: 1.05;
height:100%;
width:770px;
background-image:url(images/fondo.jpg);
}
div#top
{
position:relative;
padding: 0px;
}

div#img
{
position:relative;
height:230px;
}
div#contenent
{
position:relative;
}
div#footer
{
color:#000;
text-align:center;
}

vorrei fare in modo appunto che il footer stia sempre attaccato al bordo inferiore dello schermo e che permetta lo scroll se necessario, inoltre fare in modo che il div contenent sia elastico, cioè top e img di misura fissa, footer anche, e contenent che si adatta.. come fare?!