Il div delle foto l'ho definito con width 39% ma non avendo ancora chiaro il meccanismo possibilissimo che abbia sbagliato.
A me basterebbe riuscire a centrare tutto il contenuto di testo e foto in maniera tale che si veda con tutti i browser alle varie risoluzioni e non mi faccia quell'effetto orrendo di firefox.
Se poi ciascuna foto non è al centro del suo testo come hai visto nel link pazienza.

Questo è il mio css:
codice:
.centrato{
text-align:center;
}
.tragitto{
font-style:italic;
font-size:18px;
}

h1{
font-size:200%;
text-align:center;
}
.first{
font: 2em Georgia, serif;
color: #d98346;
text-transform: uppercase;
}
div#giorno{
width:99%;
}
div#testo{
line-height:30px;
text-align: justify; 
width:60%;
border-bottom: 1px solid #000;
float:left;
}
div#foto{
width:39%;
float:left;
margin: auto;
}
img
{
margin-left:20px;
border:none;
width:150px;
}
e il codice html con cui richiamo testo e immagini:
<div id="giorno">
<div id="testo"><span class="first">A</span>rrivo all'aeroporto di Cagliari in mattinata e trasferimento in hotel.
Nel pomeriggio, visita di Cagliari: l'anfiteatro, la cattedrale, la Torre di San Pancrazio,
il Museo archeologico. Cena e pernottamento in hotel. </div>
<div id="foto">[img]../immagini/anfiteatro.jpg[/img]</div>
</div>

Grazie per l'aiuto.