Page 69 - CSS

Chapter 6: Block Formatting Contexts

Remarks

[A block formatting context is a part of a visual CSS rendering of a Web page. It is the
region in which the layout of block boxes occurs and in which floats interact with each
other.][1]

[1]: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Block_formatting_context MDN

Examples

Using the overflow property with a value different to visible

img{
float:left;
width:100px;
margin:0 10px;
}
.div1{
background:#f1f1f1;
/* does not create block formatting context */
}
.div2{
background:#f1f1f1;
overflow:hidden;
/* creates block formatting context */
}

https://riptutorial.com/ 47