title: Div tags inside of Div tags not work in Firefox or Chrome
body: <p>This seems incredibly simple but I have no idea why I can't put a div tag inside of a container div tag as it will not show up in Firefox or Chrome properly, <em>but</em> it works in IE6...??? Code is as follows:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;link rel="stylesheet" href="style.css" /&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="container"&gt;
      &lt;div id="nav"&gt;
          &lt;p&gt;Hello&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS: style.css</p>
  
  <pre><code>body {
      background:white;
      font-family: sans-serif;
  
  }
  #container {
      margin:0 auto;
      width:960px;
      background:#e3e3e3;
      border:1px solid black;
  }
  #nav {
      padding:10px;
      margin-top:10px;
      float:left;
      width: 400px;
      height:100px;
      background:white;
      border:1 px solid black;
  }
  </code></pre>
  
  <p>It's as if the container is not expanding with the DIV tag inside of it..what gives?</p>