Explain the purpose of clearing floats in CSS

The clear CSS property specifies whether an element can be next to floating elements that precede it or must be moved down (cleared) below them.

Clearing floats (or clearfixing) basically forces the containing element to expand to contain its child elements. It thus forces the subsequent elements to appear below it.