Block Formatting Context

A block formatting context is a box that satisfies at least one of the following:

• the value of “float” is not “none”,
• the used value of “overflow” is not “visible”,
• the value of “display” is “table-cell”, “table-caption”, or “inline-block”,
• the value of “position” is neither “static” nor “relative”.

When it comes to the visual formatting model (this is how user agents process the document tree for visual media), block formatting contexts are big players. So it is crucial for CSS authors to have a solid understanding of their relationship with the flow, floats, clear, and margins.