title: Div collapse when using float
body: <p>I have the following HTML and I would like to display a blue background behind the buttons and text. Unfortunately, with the following code, the blue background disappear. If I remove the CSS for the ids buttons and text, the background is back.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>Thanks!</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" &gt;
  &lt;head&gt;
      &lt;title&gt;Untitled Page&lt;/title&gt;
      &lt;style&gt;
  
  
      #actions
      {
          background: blue;
      }
  
      #buttons
      {
          float: left;
      }
  
      #text 
      {
          float: right;
      }
  
      &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
          &lt;div id="actions"&gt;
              &lt;div id="buttons"&gt;
                  &lt;input type="button" id="btnOne" value="Bla bla" /&gt;
                  &lt;input type="button" id="btnTwo" value="Bla bla bls" /&gt;
              &lt;/div&gt;
              &lt;div id="text"&gt;Bla bla bla&lt;/div&gt;
          &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>