Problema con div

[ste902]

Ciao a tutti, voglio fare una pagina con header in alto, un menu sulla sinistra con il content sulla destra e in fondo il footer. Il problema è che non deve sfalsarsi cambiando risoluzione del browser, cosa che invece succede. Se aumento la risoluzione il content si sposta sotto il menu. Sapete dirmi cosa sbaglio? ecco il codice

body{
font-family:Arial, Helvetica, sans-serif;
margin-top: 2.5%;
margin-bottom: 2.5%;
}
h1{
	
	color:red;
	text-align: center;
	padding:0;
	margin-bottom:0;
}

div.main{
	margin: 0 auto;
	border-style: double;
	border-color: black;
	border-width: 0.3em double black;
	width: 95%;
	
}
div.header{
	clear:both;
	border-bottom: 0.3em double Black;
	
}
div.menu{
	float:left;
	border-right: 0.3em double black;
	border-bottom: 0.3em double black;
	padding:1em;
	margin-bottom: 1em;
	width:20%;
}
div.content{
	float:right;
	width: 75%;
	padding:1em;

}
div.footer{
	clear:both;
	border-top: 0.3em double black;
	padding-left:1.5em;
}

[simone.fontana]

Se fossi in te visto che non vuoi far cambiare le dimensioni e vuoi tenere tutto fisso io farei così:

HTML

<div class='contenitore'>
 <div class='header'></div>
 <div class='menu'></div>
 <div class='contenitore_testi'> </div>
 <div class='footer'> </div>
</div>

[simone.fontana]

Se fossi in te visto che non vuoi far cambiare le dimensioni e vuoi tenere tutto fisso io farei così:

HTML

<div class='contenitore'>
 <div class='header'></div>
 <div class='menu'></div>
 <div class='contenitore_testi'> </div>
 <div class='footer'> </div>
</div>

CSS

.contenitore{ 
   width: 1000px;
   height: 1200px;
   position: relative;
   margin: 0px auto; 
} 

.header{
   position: absolute;
   top: 0px;
   left: 0px;
   height: 100px;
   width: 100%; 
}

 .menu{
   position: absolute;
   top: 100px;
   left: 0px;
   height: 1000px;
   width: 300px; 
} 

.contenitore_testi{
   position: absolute;
   top: 100px;
   right: 0px;
   height: 1000px;
   width: 900px;
 } 

.footer{
   position: absolute;
   bottom: 0px;
   left: 0px;
   height: 100px;
   width: 100%;
 }

[ste902]

ok, grazie!