Salve,
dire che sono scarso con i css è dire poco, ma col tempo qualcosa la sto iniziando a capire. Solo che ora voglio fare un layout in questo modo:

- pagina a tutto schermo che si autoconfigura a seconda delle dim del brawser (liquido)
- parte top e parte bottom sempre "attaccati" rispettivamente in alto e in basso alla pagina
- parte centrale divisa in due: a sinistra menu a destra immagine con dimensioni liquide (ovvero che si configura col brawser).

Sotto posto tutto il codice che ho impostato, ma che mi da i seguenti problemi e chiedo la cortesia di un piccolo aiuto:

- parte top e bottom sono ok
- i due div della parte centrale invece non si affiancano e non risultano di altezza pari al 100%, ovvero che arriva fino in fondo a toccare il bottom.

css
codice:
html, body, form
{
    margin: 0;
    padding: 0;
    height: 100%;
}

#header
{
    height: 25px;
    background-color: #DDD1DF;
    padding: 0px;
}

#body
{
    padding: 0px 0px 25px 0px;
    margin: 0px;
}

#footer
{
    background-position: #DDD1DF;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 80px; /* Height of the footer */
    background: #974578;
}

.imageContainer
{
    width:50%
}

.imageContainer img
{
    display:block;
    width:100%
}
html
codice:
        <div id="header">
        </div>

        <div id="body">
            
            <div style="width: 100%;">
                <div style="width: 300px; vertical-align:top; float: left; background-color: #BBBBBB;">
                    
                    << menu >>

                </div>
                <div style="text-align: right;  float: inherit; background-color: #00FF00;">
                    <div class="imageContainer">
                        [img]Immagini/miaimmagine.jpg[/img]
                    </div>
                </div>

            </div>

        </div>

        <div id="footer">
        </div>
Non so dove sbaglio.
Grazie a tutti.
Igor