﻿/* STILE PER LAYOUT A 3 COLONNE CON POSIZIONAMENTI ASSOLUTI
VANTAGGI:
-	Avvantaggiati i motori di ricerca
-	Forse maggiore flessibilità di posizionamento delle varie sezioni
CONTROINDICAZIONI:
-	Non è possibile garantire che il piede stia sotto la fine delle 3 colonne ma in generale
	si posiziona sotto la colonna centrale. Se i contenuti quindi sono più corti della colonan del menu o degli extra
	il piede passerà sopra le colonne. Se si àa questa esigenza occorre pensare al layout a 3 colonne FLOAT

STRUTTURA HTML:	
La pagina HTML deve avere una struttura di questo genere:
  <div id="container">				--> Contenitore generale della pagina
    <div id="container2">			-->	Contenitore utilizzato per dare una seconda immagine di sfondo alla pagina così da far estendere le colonne laterali fino al piede
        <div id="header"></div>		-->	Intestazione
        <div id="content"></div>	-->	Contenuti
        <div id="extra"></div>		-->	Contenuti Extra
        <div id="navigation"></div>	-->	Menu
        <div id="footer"></div>		-->	Piede
    </div>
  </div>


NOTE:
-	Simplified Box Model Hack (SBMH):
	Tecnica che vuole correggere un bug di Explorer 5.x che include nalle dimensioni degli oggetti
	anche i bordi e i padding che invece dovrebbero essere aggiunti alla dimensione dichiarata.
	La tecnica ripete tre volte la dimensione sul foglio di stile e, a causa del diferente modo che hanno i browser di
	interpretare questa ridondanza, applicano la giusta dimensione al browser che la sta interpretando.
	In particolare nella seconda dichiarazione (IE 5.x) dobbiamo impostare la misura sottraendo il padding e i bordi che diamo
	all'oggetto in modo che anche questo browser risulti compatibile

-	Per trasformarlo in un layout a 2 colonne nascondendo gli extra basta aggiungere 
	- display:none a div#extra
	- modificare il margine destro di div#content azzerandolo o comunque della distanza dal bordo sinistro della finestra che si vuole mantenere

*/


html,body{
	margin: 0;
	padding:0;
}

/*stili specifici per il layout*/
div#header
{
	height:166px;
}
div#wrapper
{
	height:282px;
}
div#contenitore
{
	min-height:500px;	
}
div#footer
{
	height:66px;
}
div#footer_sx
{
	float:left;
	padding:11px 10px 0px 10px;
	width:240px;
} 
div#footer_dx
{
    padding:11px 0px 0px 20px;
	float:right;
	width:600px;
}
div#footer_c
{
	padding:0px 0px 0px 0px;
}

