occupare lo spazio

[Reicon]

Sto realizzando una pagina web con una componente top, una componente bottom e un div nel mezzo. Quello che vorrei ottenere e' riuscire a piazzare il bottom in fondo alla pagina e far si che il div si espanda occupando tutto lo spazio tra il top ed il bottom. Dato che la pag sara' visualizzata sia su pc che su tablet non posso usare dimensioni fisse, ma usando height:100% va a considerare le dimensioni dello schermo. In questo modo il div diventa troppo grande in quanto top e bottom occupano spazio. Si puo' ottenere il dimensionamento automatico senza usare javascript o php ma solo da css?

[deleted_129]

Puoi fare tutto tramite percentuali..esempio:

<style>
*{
margin:0px;
padding:0px;
}
#top{
height:10%;
background:green;
}
#bottom{
height:10%;
background:red;
}
#principale{
background:pink;
min-height:80%;
}
body{
height:100%;
}
</style>
<div id='top'></div>
<div id='principale'></div>
<div id='bottom'></div>

personalmente sono contrario alle percentuali, ma questo è un modo semplice...altrimenti potresti mettere la div bottom e la div top in position fixed e il principale come height 100% con un po' di padding...

[Reicon]

Purtroppo però top e bottom devono avere dimensioni fisse in quanto sono immagini. Perciò non so se le proporzioni si possano usare così...