Io ho risolto nel seguente modo:
codice:
body {
margin: 0;
padding: 0;
text-align: center;
background:#EEE;
color: #000;
font: 80% Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#centrato {
width:700px;
margin:auto;
text-align: left;
}
#corpo {
float:left;
width: 700px;
background: #FFF;
}
#colonna-1 {
float:left;
width:300px;
background: transparent;
color: #000;
position: relative; left: 200px;
}
#colonna-2 {
float:left;
background: transparent;
color: #000;
width:200px;
position: relative; right: 300px;
}
#colonna-3 {
float:left;
width:200px;
background: transparent;
color: #000;
}
#colonna-4 {
width:300px;
background: #ccc;
color: #000;
}
#intestazione {
background: #666;
color: #fff;
}
#pie-di-pagina {
clear: left;
background: #666;
color: #fff;
}
#intestazione, #colonna-1, #colonna-2, #colonna-3, #colonna-4, #pie-di-pagina {
padding: 0.5em 0;
}
div p {
margin: 0;
padding: 0.5em 1em;
}
span.cID {
display:block;
float:left;
padding:.2em .5em;
border: 2px solid #900;
background:#FFF;
color:#000;
margin: 0 0.5em 0 0;
font:bold 1.2em "Courier New", Courier, monospace;
}
e l' html:
codice:
<body>
<div id="centrato">
<div id="intestazione">
Lorem ipsum mea sale iisque laoreet ei. Decore aperiam blandit quo ei. Fastidii patrioque constituto sea ea, qui ad sumo erant veritus, debet everti est ad. Pri simul fastidii fabellas an. An option incorrupte mea, omnium numquam petentium ei pro. Per ex nostro audire percipitur, eos latine pericula intellegat ad.</p>
</div>
<div id="corpo">
<div id="colonna-1">
<span class="cID">1</span> Atqui numquam singulis his ne, an eius fugit velit vel. Ut vix nisl philosophia, his ex reque petentium interpretaris. Autem zzril invidunt eam ex. Eu malis error sed, erat omnesque an has. Vix et primis omnium, qui vidit debitis ea.</p>
<div id="colonna-4">
<span class="cID">4</span> Prova per colonna aggiuntiva che si dovrebbe posizionare sotto quella centrale, speriamo, altrimenti tutto lavoro per niente.</p>
Ho usato dei colori da bestia, lo so. Per dare l' impressione che le colonne siano tutte alla stessa altezza si puo' inserire una gif come sfondo nel corpo.</p></div>
</div>
<div id="colonna-2">
<span class="cID">2</span> Stet invenire nam no. Quando nostro eligendi has an, labores vulputate id nam, sonet impedit platonem id sit. In his democritum eloquentiam, an sed everti voluptaria. Doctus persecuti vituperata cu mea.</p>
Sint oblique maluisset duo ut. Ut eam ignota persius perpetua, quo id possim accusata oportere, timeam laboramus ius et. Habeo nostro electram ut sit, eum nisl reque te. Legimus tibique contentiones pri et, an ius facete tibique principes, dico dolorem contentiones pro ex.</p>
</div>
<div id="colonna-3">
<span class="cID">3</span> Idque virtute periculis mea et, mea id atqui perfecto senserit, semper conceptam et sed. Sit malorum phaedrum disputationi an. No bonorum insolens sit, periculis consequat voluptatibus sit in. Per no affert nostrud ceteros, has id nonumy iracundia, erant disputando ne sea. Dictas antiopam reprimique at sit, velit doctus an quo, illud quidam in vel.</p>
</div>
</div>
<div id="pie-di-pagina">
Kasd omnium nec te. At rebum iracundia sea, ne soleat insolens tincidunt eum, virtute accumsan ius ne. Postea reformidans ut vis, qui elit singulis philosophia no, sed id malis veniam convenire. Et his inani eirmod integre. Ius impedit conceptam ex. At sanctus facilisi elaboraret vis, ius id inani admodum, ut scripta intellegat vis. Ad est justo congue neglegentur, mea ad alia deterruisset, per zzril vidisse ea.</p>
</div>
</div>
</body>
gradirei sapere se puo' andare bene.