LAYOUTS - CSS: Professional Techniques for Modern Layout - page 115

CLEARFIXING
“Cleari xing” is an older technique that has been largely supplanted by the preceding two
techniques, but it's easier to use cleari xing under certain circumstances. h ese arise most
ot en with older versions of Internet Explorer, which in some circumstances don't properly
contain l oats using the previously discussed tips.
h e simplest method of cleari xing is inserting an element into the document and setting it to
clear. For example:
div#main + * { clear : left ;}
< div class="column one">...< / div>
< div class="column two">...< / div>
< div class="column three">...< / div>
< br class="clearfix">
< p>...< / p>
h e br element is the key here. It will push itself, and therefore anything that comes at er it,
below the l oated columns that come before. In order to make that happen, you will need the
following CSS:
.clearfix { display : block ; clear : both ;}
117
Figure 4-11: Using the “clearfi x” method to push the footer below fl oated columns.