Salve,
sto disegnando un template per un blog in cui è presente un DIV corpo centrale ad altezza variabile (dipendente dal contenuto) e dei DIV ai lati di questo che riproducono un'immagine di sfondo ripetuta sull'asse Y in modo da "incorniciare" correttamente il corpo centrale.

Il problema è che quando il DIV centrale "cresce" in altezza, i due DIV laterali non fanno lo stesso.

Come posso risolvere?

Come mai nel DIV centrale il testo non va a capo?

Il mio attuale codice è questo (ho lasciato i CSS inline per semplicità, ma ovviamente nel risultato finale saranno in un foglio di stile esterno:

Codice PHP:

 <div style="width=60px;  height=auto; float:left; background-image=img/template_r7_c1.gif; background-repeat:repeat-y;">[img]img/template_r7_c1.gif[/img]</div>


   <div style="width=680px; height=auto; float:left; word-wrap: break-word;"> 

...TESTO MOLTO LUNGO...</p></div>


<div style="width=60px;  height=auto; margin-left:740px; background-image=img/template_r7_c17.gif; background-repeat:repeat-y;">[img]img/template_r7_c17.gif[/img]</div> 
Allego un file per rendere l'idea del risultato attuale e di quello che vorrei ottenere (quello che vorrei ottenere l'ho ricreato con photoshop )



Grazie.
Ale