title: Not able to apply margin to div
body: <pre><code>&lt;input type="text" id="title" /&gt;
  &lt;input type="button" id="save_post" class="button" value="Submit" /&gt;
  &lt;div id="map" style="margin-top:10px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>For some reason there is no margin in the rendered page.</p>
  
  <p>The first <code>input</code> is directly to the left of the second <code>input</code>, and the <code>div</code> is directly under both, with no spacing in between.</p>
  
  <p>I've also tried placing <code>&lt;br /&gt;</code> tags but that didn't work either.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>CSS</p>
  
  <pre><code>.button {
      width: 80px;
      height: 34px;
      border: none;
      background: #673491;
      color: #fff;
      float: left;
  }
  
  #title {
      height: 30px;
      width: 276px;
      border: 1px solid #cbcbcb;
      background: #fff;
      text-indent: 10px;
      color: #999999;
      float: left;
  }
  
  #left {
      width: 360px;
      float: left;
      margin-right: 7px;
      padding-top: 24px;
  }
  
  #content {
      width: 800px;
      margin: 0 auto;
      text-align: left;
  }
  
  body {
      background: #f2f2f2;
      text-align: center;
      color: #999999;
      font-family: arial, verdana;
      font-size: 13px;
      margin: 0;
      padding: 0;
  }
  </code></pre>