Ma infatti non ho nessuna esigenza nel creare un layout ad altezza fissa, proprio per questo motivo, cioè che ogni sezione ha un contenuto variabile!
Perchè ho dovuto usare questa altezza fissa allora?
Semplicemente per il footer!
Stranamente con iExplorer il problema del footer non esiste, infatti esso si va a posizionare esattamente in fondo alla pagina, dove finisce tutto il contenuto (mettendo l'altezza appunto in auto)!
Ma in opera e mozilla il footer si va a posizionare invece al centro della pagina!!
E' come se per opera e firefox il bordo inferiore della pagina non'è la fine di essa, (dove termina il contenuto diciamo) ma è in pratica il bordo inferiore del browser!..
Non so se mi spiego!
E' come se aprissi una pagina 800x600 e il footer si va a posizionare in basso ai 600px!
Se invece la visualizzo in 1024x768, il footer si va a posizionare in basso ai 768px!
Io infatti volevo creare una pagina con un top, un contenuto centrale (diviso verticalmente), e un footer che stia sempre a fine contenuto!
Per maggior chiarezza vi faccio vedere il codice:
HTML:
codice:
<div id="contenitore">
<div id="top"></div>
<div id="corposx"></div>
<div id="corpodx"></div>
<div id="footer"></div>
</div>
CSS:
codice:
#contenitore {
width:800px;
height:auto !important;
height:100%;
min-height:100%;
position:relative; }
#top {
width:800px;
height:200px;
position:relative; }
#corposx {
width:500px;
height:auto !important;
float:left;
position:relative; }
#corpodx {
width:300px;
height:auto !important;
float:left;
position:relative; }
#footer {
width:100%;
height:50px;
bottom:0;
margin-left:-400px;
left:50%;
position:absolute; }
Ovviamente vi risparmio i vari tag e css come colori di font, sfondi, ecc...
Ciò che mi interessa farvi vedere è appunto la struttura del layout, ed è questa che vi ho mostrato!
Rispondi quotando
