block formatting contexts

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

Block formatting contexts contain floats and do not overlap floats.

Vertical margins do not collapse outside of block formatting contexts.

In IE 6, hasLayout establishes (more or less) block formatting contexts, hence the use of zoom (MS proprietary property) in these pages.

You should avoid using clearfix (see Everything you Know about Clearfix is Wrong).

Try These

Watch This


Check This

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

Edit This

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