Ciao ho un sito da impaginare con dei DIV.

La struttura base sarà:

DIV MAIN
DIV HEADER
DIV MAIN
DIV LEFT
DIV RIGHT
DIV FOOTER

Ora ho costruito il tutto nel seguente modo:

HTML

codice:
<body>
	<!-- 
			CONTENITORE PRINCIPALE
	//-->
	<div id="Main">
		<div id="Header">
			<!-- 
					CONTENITORE HEADER
			//-->
				
		</div>
		<div id="Footer"></div>
	</div>
</body>
CSS

codice:
Html{
		height:100%;
		margin:0; 
	}
Body{
		background: #F7F7F6 url(../Image/Slice/background.png) repeat-y 50% 0;
		height:100%;
		margin: 0;
		padding: 0;
		text-align: center;
}
#Main{
		margin: 0px auto;
		width: 850px;
		position: absolute;
		bottom:0;
		left:0;
		margin: 0px 0px 0px 103px;
		float:left;	
	}
#Header{
		margin: 0px auto;
		width: 850px;
		height: 81px;
	}
#Footer{
		width: 850px;
		height: 76px;
		background:#F7F7F6 url(../Image/Slice/bottom.png);
	}
Ora quano la pagina è in full screen, la parte del footer si allinea perfettamente con lo sfondo per simulare la fine della pagina, ma anche se ho messo il float, quando ridimensiono la finestra la parte del footer, non si allinea allo sfondo. Come posso fare?