Tre righe...

[GatesOfdawn]

Ciao a tutti

ho un div contenitore e tre div interni che sono tre righe, il primo div e il terzo cioè header e footer sono di dimensioni fisse, quello centrale vorrei che occupasse tutto lo spazio rimanente in modo tale che il div footer mi venga posizionato esattamente sul bordo inferiore della pagina, come faccio?



Grazie a tutti

[lorenzos]

Innanzitutto è una soluzione poco pratica poichè il contenuto dovrà non superare mai una determinata mole di informazioni...

Comunque devi assegnare al div contenitore una classe e poi via css:
#contenitore{
margin-top:0px;
margin-bottom:0px;
}

Poi al div footer assegni solo il margin bottom e l'altezza.

Fammi sapere!

[GatesOfdawn]

Si lo so che è poco pratico ehm volevo utilizzare il layout per una pagina iniziale, di copertina al sito...e comunque anche se non la utilizzerò mai devo capire perchè non va

Questo è l'html

<div id="all">
<div id="up">HEADER</div>
<div id="middle">CENTRO</div>
<div id="down">FOOTER</div>
</div>

nel css:

div#all{margin-top:0px; margin-bottom:0px;}
div#up{height:140px; background-color:#fc9;}
div#middle{background-color:#ccc;}
div#down{height:140px; margin-bottom:0px; background-color:#fc9;}

il risultato in allegato...non cambia nulla.

Grazie

[cane-nero]

dai un altezza al div centrale (100%) e assegna anche un' altezza in percentuale al div contenitore

[Stan]

Scusate il riuppaggio, ma io dovrei fare la cosa inversa.

Il div centrale e fisso, e vorrei che quello sopra e quello sotto occupassero lo spazio rimanente, il div centrale dovrebbe restare al centro.

Praticamente sul div centrale ci metto un pattern di background e un flash, sopra e sotto solo un colore

[mahamatt]

prova così:
(in grassetto le differenze)

div#all{margin:0; width:100%; position:relative; }
div#up{height:140px; background-color:#fc9;} 
div#middle{background-color:#ccc;} 
div#down{height:140px; position:absolute; bottom:0; left:0; background-color:#fc9;}

[mahamatt]

scusa, non avevo letto bene quello che volevi fare... in realtà basta qualcosa di molto più semplice
se vuoi che le bande in alto e in basso siano vuote, basta un solo div a cui dai il giusto margine:

body { background-color: #abcdef; }
div#middle {margin:140px 0; width:100%; }

se ho ben capito, così dovrebbe funzionare.... fai un tentativo!