title: CSS container height zero... why not height of contents?
body: <p>I am not seeing any vertical space (specified by the 50px margin in lineitem) between lineitem elements. However, if I add something like height:40px; to lineitem's css format, then both the height and the margin are respected. Why doesn't lineitem just derive the heights of the input and label elements and add the margin to whatever that is? </p>
  
  <pre><code>&lt;div id="checkoutform"&gt;
  &lt;div class="lineitem"&gt;
  &lt;input type="text" name="EMAIL"&gt;
  &lt;label for="EMAIL"&gt;Your E-Mail:&lt;/label&gt;
  &lt;/div&gt;
  
  &lt;div class="lineitem"&gt;
  &lt;input type="text" name="NAME"&gt;
  &lt;label for="NAME"&gt;Your Name:&lt;/label&gt;
  &lt;/div&gt;
  &lt;/div&gt;&lt;!-- #checkoutform --&gt;
  </code></pre>
  
  <p>And the CSS:</p>
  
  <pre><code>#checkoutform .lineitem {
      margin:0px 15px 50px 0px;
      clear:both;
  }
  
  #checkoutform label {
      float: right;
      text-align:right;
      font-family:"Open Sans";
      font-weight:normal;
      font-size:14px;
  }
  
  #checkoutform input {
      width:280px;
      float:right;
      font-family:"Open Sans";
      font-weight:normal;
      font-size:14px;
  }
  </code></pre>