The easy way to clear floats. Clearfix div using simple CSS3

This easy clearing method uses a clever CSS pseudo selector (:after) to clear floats. Rather than setting the overflow on the parent, you apply an additional class like “clearfix” to it. Then apply this CSS:

This will apply a small bit of content, hidden from view, after the parent element which clears the float. This isn’t quite the whole story, as additional code needs to be used to accommodate for older browsers.

Leave a Reply

Your email address will not be published. Required fields are marked *