Div che non va a capo

[killumix]

Salve a tutti

Ho un problema di impaginazione con le immagini contenute nei Div . A questo indirizzo è presente la mia pagina http://www.havingroove.altervista.org/art.html in pratica le miniature dovrebbero andare a gruppi di tre sulla stessa riga, ma aggiungendo un tag br tra un div e l'altro non ci sono riuscito. Sono agli inizi di questo nuovo modo di impaginare,forse sara' una sciocchezza ma ho ragionato come se fosse un testo ...

[bionicoz]

Visto che i tuoi box hanno (giustamente) l'attributo float il <br> non basta.
Ci sono diverse soluzioni a questo "problema":
1) Aggiungi la regola clear:both al <br> che usi per andare a capo e lasci il floata ai div .colonna
2) Forzi il contenitore dei div .colonna ad essere non più largo di 3 elementi (es se ognuno è largo 100 pixel con 10 px di margine, il contenitore puoi farlo largo 330px)
3) Setti i div .colonna ad essere trattati come degli elementi inline-block con la regola .colonna{ display: inline-block ;}

Qui del codice: http://jsfiddle.net/bionicoz/jywhmvkf/

Cià.

[killumix]

Con la regola del clear:both al <br> l'impaginazione va alla grande , un consiglio per quanto riguarda l'insrimento di altri box. Come potrai vedere nella pagina aggiungendo gli altri boxe resta la parte non coperta dal background dando un risultato pressoche' pessimo. Mi converrebbe per caso dividere il <divclass="contenitore_foto"> , cosi' come ho fatto nel main?