clear: both;

<div style="background-color: #888888; width:380px;">
   <div style="float:left; background-color: #AAAAAA; width:200px; text-align: center;">
      <h1>om</h1>
      <span>is a sacred syllable</span>
   </div>
   <div style="float:right; background-color: #CCCCCC; width:150px; color: #000000;">
      <ol>
         <li>Dharmic</li>
         <li>Hinduism</li>
         <li>Buddhism</li>
         <li>Jainism</li>
      </ol>
   </div>
   <div style="clear:both; background-color: #666666; width:380px;">
      <p>It's Sanskrit!</p>
   </div>
</div>

 
 

The HTML above creates a div with two divs floating side-by-side within it and a third div wrapping beneath the two floating divs. Ken Jackson orginally showed me the clear: both; CSS trick at Headspring. The code makes this:

 
 

om

is a sacred syllable

1. Dharmic
2. Hinduism
3. Buddhism
4. Jainism

It's Sanskrit!