title: Why Isn't My Clear Style Preventing Sibling Element From Floating?
body: <p>I have an extremely simple snippet of HTML/CSS:</p>
  
  <pre><code>&lt;div style="float: left; width: 180px; clear: both;"&gt;Foo&lt;/div&gt;
  
  &lt;div style="float: left; width: 180px;"&gt;Bar&lt;/div&gt;
  </code></pre>
  
  <p>Both divs float left, but the Foo div has clear: both.  That should prevent the Bar div from floating next to it ... but it doesn't.  If you throw that HTML into a browser you'll see the two divs are adjacent.</p>
  
  <p>What am I failing to understand about clear?</p>