Ciao a tutti! sto cercando di realizzare un layout per il mio sito con 3 colonne fluide che si devono estendere in altezza per tutta la pagina.
Ho fatto vari test e questo è quello che ho ottenuto:
Con questo codice sono riuscito ad ottenere sl una colonna verde che si estende per tutta l'altezza della viewport del browser mentre io vorrei che si estendesse per tutta la pagina fino ad arrivare al footer (che ho fatto di colore arancione)... qualche idea?codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Test</title> <style> * { margin:0; padding:0; } hmtl, body { height:100%; } body { background:#F00; } #corpo { min-height:100%; position:relative; margin-bottom:-30px; background:#00F; } .clearfix { clear:both; height:30px; } #piede { height:30px; background:#FA0; position:relative; } #left { float:left; position:relative; z-index:10; height:100%; width:12%; background:#0F0; } </style> </head> <body> <div id="left">prova</div> <div id="corpo"> <div id="dati"> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p> prova</p></div> <div class="clearfix"></div> </div> <div id="piede"></div> </body> </html>
P.S.
In questo codice di test ho inserito solo una colonna per semplicità
grazie in anticipo!


Rispondi quotando