Question

I’ve got a main container, with floating divs in it. It stops before them and doesn’t reach their bottom? What’s the best cross-browser way of fixing that?

(page in question is http://lauradifazio.altervista.org/cms/ and the main container is a red div which stops under the cyan+orange one, because that one isn’t floated)

Answer 1

There are mainly two ways of achieving this result, you need to either:

• float left the main container (this solves your problem, but arises more, since the centered layout breaks up)
• put an empty div with the style clear:left just before the closing tag of the main container

Since this concept is at the base of css design, I strongly advise you to have a look at this book: Gianluca Troiani – CSS: guida completa it covers all the aspects of css layout and coul really change your life.. it changed mine! 🙂

Buona fortuna