salve ragazzi ho un problemino con i div, mi aiutate?
dunque ho creato un div contenitore (800x800px) in cui ho inserito un div "header"(800x100) un div "footer"(800x100) un div "contenuto"(600x600) e un div "navigazione" (200x600). Successivamento ho cambiato quest'ultimo valore in 200x200 in modo da poter inserire un ulteriore div che ho chiamato "nuovo" e quindi gli ho dato le dimensioni di 200x400. in teoria non sono andato fuori misura e sono rientrato negli 800 px del contenitore. Il problema è però che non riesco ad allineare il div "nuovo" tra il div navigazione e il footer. dopo avere provato i vari float e clear non sono riuscito a risolver eil problema e allora ho inserito il div "nuovo" all'intenro del div navigazione (ditemi se è un errore please) e in questo caso ho risolto in parte il problema, soltanto che il div "nuovo" si "mangia" parte del div "navigazione" che è senza contenuto e di conseguenza si viene a creare uno stacco tra div nuovo e footer.
come posso risolvere?
vi ringrazio anticipatamente vi allego il codice cosi capite meglio cosa voglio dire

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home Page</title>
<style type="text/css">
<!--
#contenitore {
height: 800px;
width: 800px;
border: 1px solid #999;
float: none;
margin-right: auto;
margin-left: auto;
background-color: #CCC;
}
#header {
height: 100px;
width: 800px;
}
#navigazione {
float: left;
height: 200px;
width: 200px;
}
#contenuto {
float: left;
height: 600px;
width: 600px;
text-align: justify;
}
#nuovo {
height: 400px;
width: 200px;
background-color: #0F0;
}
#contenitore #contenuto p {
margin-top: 0px;
padding-top: 0px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
font-size: 12px;
}
#footer {
float: left;
height: 100px;
width: 800px;
}
body {
background-color: #666;
}
body,td,th {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #006;
}
#contenitore #navigazione p {
background-color: #666;
border-bottom-width: 1px;
border-bottom-style: dotted;
border-bottom-color: #999;
padding: 10px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
-->
</style>
</head>

<body>
<div id="contenitore">
<div id="header">Inserire qui il contenuto per id "header"</div>
<div id="navigazione">


prova</p>


prova</p>


prova</p>


prova</p>


prova</p>
<div id="nuovo">Inserire qui il contenuto per id "nuovo"</div></div>
<div id="contenuto">


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam lacinia enim vel turpis tempus sit amet malesuada est tincidunt.</p>
</div>
<div id="footer">Inserire qui il contenuto per id &quot;footer&quot;</div>
</div>
</body>
</html>