This excellent free article, Control Block Formatting Context, by Zoe Gillenwater is at Community MX.
In order to become a skilled CSS developer, you need to understand the underlying concepts of CSS that make it work and not just how to produce certain visual effects. The ‘block formatting context’ is one of those concepts that drives how CSS affects your page without you even knowing it.
The easiest way to think about a block formatting context is as an isolated container that controls the layout of the boxes within it without regard for elements outside of it. For instance, when you float a div, it establishes a new block formatting context. Nothing inside the float will interact with anything outside the float.