Dovresti testarlo anche in Opera e FF1: credo che avrai delle sorprese.
I blocchi vuoti possono venir ignorati dai browser, e qualche browser effettivamente lo fa.
Comunque ci sono anche errori di semantica (ad esempio il titolo inserito in un <div> anziche` in un <hX>).
Per quanto riguarda le dimensioni fisse: mi pare che usi tutto sfondi no-repeat: quindi se un blocco si allarga/allunga si vedono degli spazi bianchi. E` chiaro che in queste condizioni non si puo` pensare di usare layout elastici.
Credo di aver capito (ma nonostante te lo avessi chiesto non hai risposto) che la griglia ti serve per inquadrare una scritta dentro uno sfondo che viene montato pezzo per pezzo e rappresenta una immagine unica. Una cosa del genere io la farei con un'immagine unica cui sovraporrei la scritta con sfondo trasparente, opportunamente centrata. La struttura risulterebbe molto piu` leggera, ed anche in caso di non caricamento delle immagini o del CSS il tutto avrebbe molto piu` senso.
Una cosa del genere:
codice:
<div id="pentola">
<h2>spaghetti alla amatriciana</h2>
<p class="pent">tutti i contenuti di pent</p>
</div>
Con CSS del tipo:
codice:
#pentola {
position: relative;
margin: 0 auto;
width: 499px;
height:518px; /*altezza totale della pentola fissa*/
border: 0px dotted #3333ff;
}
#pentola h2 {
position: absolute;
top: 20px; /* numero a caso: occorre sistemarlo */
left: 50%;
width: 412px;
margin-left: -206px;
text-align: center;
}
#pentola p {
position: absolute;
top: 50px; /* numero a caso: occorre sistemarlo */
left: 50%;
width: 412px;
margin-left: -206px;
text-align: left; /* ??? */
}