Un problema che si ripete molte volte per chi crea layout o smanetta con css e html è impostare il footer fisso sempre nella parte inferiore del browser.
Oggi vi mostrerò come impostarlo con poche righe di codice.
Codice Html:
<div id="container"> <div id="content"><!-- contenuto --></div> </div> <div id="footer">Footer</div>
Dove container è il div che contiene l’intero sito, content è appunto per il contenuto vero e proprio del sitoweb, e il div footer contiene tutte le informazioni a piè di pagina.
Il css che va applicato per fare in modo che il nostro footer resti sempre in fondo alla pagina, a prescindere dal content ( contenuto del sito ) è questo:
html,body {height:100%; margin: 0;} #container {min-height:100%;height:auto !important; /*per gli altri browser*/height:100%; /*per IE 6*/ margin-bottom:-50px;} #content { padding-bottom:50px; } #footer{height:50px;width: 100%;background: #00A2FF url(bgfooter.jpg) repeat-x;}
Ricordate solo che in base all’altezza del footer, lo stesso numero deve essere impostato per margin-bottom di #container
ps. ovviamente non dimenticarti di caricare il css dal file html
Commenti
Recensioni