HTML and CSS Reference
The clear property will clear only floated elements, so applying clear:
both to both columns would not cause the footer to drop down, because
the footer is not a floated element.
So use clear on non-floated elements, and even occasionally on floated
elements, to force page elements to occupy their intended space.
Fixing the Collapsed Parent
One of the most common symptoms of float-heavy layouts is the “collapsing
parent”. This is demonstrated in the example below: