block formatting contexts
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”.
Because the pink box does not establish a block formatting context, it does not enclose the yellow box.
Floats always enclose floats.
Style the pink box with:
display: table;