Salve a tutti!
Ho seguito questo vostro tutorial riuscendo a fissare il footer come descritto. Tuttavia sorge un piccolo problema: ho la necessità di espandere le tre colonne fino al margine superiore del footer, ma "height:100%" sembra non funzionare: come potete notare lo sfondo dei blocchi si adatta solamente al testo.
Qualcuno sa perché e come potrei risolvere? Grazie mille per la disponibilità
Per chiarezza posto soltanto la struttura di base differenziando i blocchi con colori diversi!
Senza-titolo-1.jpg
codice HTML:<body> <div id="container"> <div id="header">HEADER</div> <div id="sidebar1">SINISTRA</div> <div id="wrapper">CENTRO</div> <div id="sidebar2">DESTRA</div> <div id="push"></div> </div> <div id="footer">FOOTER</div> </body>codice HTML:html, body { height: 100%; margin: 0px; } #container { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -50px; } #footer, #push { height: 50px; clear: both; } #footer { background-color: #FAA53A; height: 50px; overflow: hidden; width: 100%; border-top: 10px solid #F58529;} #header{ background-color: #FAA53A; border-bottom: 10px solid #F58529; height: 100px; width: 100%;} #sidebar1 { float: left; width: 20%; background-color: #93A5C4; background-color:#3CF; height: 100%; } #wrapper { width: 60%; float: left; background-color:#CF0; height: 100%; } #sidebar2 { float: left; width: 20%; background-color: #93A5C4; height: 100%; }
Rispondi quotando