block formatting contexts

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

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;

Try These

Watch This


Check This

<div id="aqua">aqua</div> <div id="pink">pink     <div id="yellow">yellow</div> </div>

Edit This

Use shift + enter to create new lines (even in Safari and Chrome).