An Solution To Clearing Floats

Hold on Cowboy

This blog post is pretty old. Be careful with the information you find in here. It's likely dead, dying, or wildly inaccurate.

I used to clear floats by adding the CSS style clear: both to the element underneath the floating elements. This was a pain because sometimes you had to add a tag under it with the clear: both set. Then while searching for a better way (there is always a better way) to clearing floats I found the overflow rule.

Essentially, just add overflow: hidden to the parent of the floating elements. That will clear the floats so that elements under the floats will be cleared. Excellent!

Did this help you out? It took me a few days to piece together all this information together, I hope this saves you some time (who knows, maybe the future me will be thankful I wrote this down). Let me know your thoughts. [email protected]