title: 100% Div Causes Child's Bottom Margin to be Cut Off
body: <p>I have a #wrapper div that is 100% height. Inside of that I have several content divs, each are displayed as inline-block and have a bottom margin. The problem is that this bottom margin is somehow being collapsed.</p>
  
  <p>The problem can be seen with very simple code:</p>
  
  <pre><code>&lt;div id="wrapper"&gt;
      &lt;div id="content"&gt;
          &lt;!-- lots of content here that will fill the browser window --&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I've created an example which can be seen here: <a href="http://jsfiddle.net/Y6tJw/" rel="nofollow">http://jsfiddle.net/Y6tJw/</a></p>
  
  <p>I have a feeling this is a webkit issue as both Firefox and IE render the page with the proper margin. Any help?</p>