[CSS] Evitare la sorapposizione dei div

[sonep]

Buon giorno a tutti,
mi trovo in difficoltà con dei div;
praticamente ho un div contenitore con all'interno un div che contiene un'immagine(disposto a sinistra del contenitore), un div che contiene un'immagine(disposto a destra del contenitore), un div che contiene del testo(disposto a destra sotto il div che contiene l'immagine) e un ultimo div che contiene testo che dovrebbe essere disposto sotto il terzo div che contiene il testo.

ecco il codice xhtml:

Codice: Seleziona tutto

<div id="commento">
<div id="fotoC"><img src="immagini/fotoC.jpg" alt="" /></div>
<div id="tipoC"><img src="immagini/commento.jpg" alt="" /></div>
<div id="titoloC"><h5>Lettera aperta di Piero Lacorazza al Sen. Emilio Colombo</h5></div>
<div id="testoC">Il coordinatore della segreteria regionale dei Democratici di Sinistra, Piero Lacorazza, ha inviato stamattina una lettera aperta al Sen. Emilio Colombo, in occasione del 60° anniversario della Repubblica Italiana, che ricorre il prossimo 2 giugno.</div>
</div>

e questo è il css:

Codice: Seleziona tutto

#commento {
border: 1px solid Black;
position: relative;
width: 360px;
text-align: left;
}

#tipoC {
border: 1px solid Black;
position: absolute;
top:0; right:0;
}

#titoloC {
border: 1px solid Black;
float: right;
position: absolute;
top:20px; right:0px;
width: 160px;
}

#testoC {
border: 1px solid Black;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
clear: right;
}

io vorrei fare in modo che il div #testoC non si sovrapponga al div #titoloC ma inizi quando quest'ultimo finisce.
Forse un immagine rende meglio l'idea:


ho provato ad utilizzare la proprietà clear:right; ma senza risultati.
ho cercato su internet ma non riesco a trovare le informazioni necessarie...quindi ho pensato a voi.
ciao

[thomas]

prova con

Codice: Seleziona tutto

clear: both

[sonep]

ho già provato...con lo stesso risultato!

il miglior risultato che ho ottenuto è arrivato togliendo position: absolute; da #titoloC, ma rimaneva il problema che il div #titoloC lo faceva nascere in corrispondenza della fine della foto, sul lato destro!

[sonep]

risolto: ho dato una larghezza del 50% al div #fotoC, e quindi usato clear:both;
ora tutto è ok!

grazie per l'aiuto.
ciao