Ciao a tutti, avrei un piccolo problema.
Sono nuovo nel campo HTML + CSS, e mi trovo già bloccato.

Vi posto il codice attuale della home page che vorrei realizare :

codice:
<html>
	<head>
		<title>Japan History</titl>
		<link type="text/css" href="style/style.css" rel="stylesheet" />
	</head>
	<body>
	<div class="container">
	<div class="top">TOP</div>
	<div class="body">BODY</div>
	<div class="footer">FOOTER</div>
	</body>
</html>
E questo è il codice del CSS :

codice:
body {
	background-color: #000000;
	margin: 0;
	padding: 0;
	color: #ffffff;
	font-family: Verdana,sans-serif;
	font-size: 11pt;
}

a {
	color: #F59300;
	font-weight: bold;
	text-decoration: none;
}

a:hover {
	color: #ffffff;
}

div.container {
	background-repeat: no-repeat;
	bottom: 0px;
	top: 0px;
	width: 800px;
	height: 100%;
	margin: auto;
	border: 2px solid red;
}

div.top {	
	height: 150px;
	border: 2px solid blue;
}

div.body {
	border: 2px solid yellow;
}

div.footer {
	height: 150px;
	border: 2px solid green;
}
Quello che mi piacerebbe fare è questo, il div.body deve "variare" a seconda del contenuto ma se non cè nulla, che copra l'intera immagine a schermo.
Cosi se ho una risoluzione a 800 x 600 o 1024 x 768 (e superiori) il sito si allunghi automaticamente in modo da coprire l'intera pagina in lunghezza nonostante magari ci sia scritta una sola frase.