Ciao, avrei bisogno di un chiarimento.

Ho scritto questo layout con l'intento di avere una pagina al 100% in altezza, con il footer sempre in basso.

Però non riesco.

Il "footer" rimane appiccicato al "content", in alto.

Cosa sbaglio?

GRazie


codice:
 
<style type="text/css">
<!--
body, html {
	height:100%;
	margin: 0;
	background-color:#f1f1f1;
		
}

#main {
	margin: auto;
	width: 760px;
	height:100%;
	background-color: #fcf;
}

#header {
	height: 100px;	
	background-color: #484848;
	overflow: auto;
}


#content {
	background-color: #fff;
		
}

#footer {
	height: 30px;
	background-color: #60e;
}
-->
</style>


codice:
 
<html>
<head>
</head>
<body>

<div id="main">
	<div id="header">
		header		
	</div>
	<div id="content">
		content
	</div>
	<div id="footer">
		footer
	</div>
</div>
</body>
</html>

Allego un esempio grafico..