title: Margin bottom not working on %100 div
body: <p>I have the following html code:</p>
  
  <pre><code>&lt;html&gt;
   &lt;body style="margin:0px; padding:0px;"&gt;
     &lt;div id="outer" style="height:100%;"&gt;
       &lt;div id="header" style="height:40px; background:blue;"&gt;Header&lt;/div&gt;
       &lt;div id="main" style="height:100%; margin-bottom:-40px; background:red; overflow:auto;"&gt;
          &lt;p style="height:1000px"&gt;Main&lt;/p&gt;
       &lt;/div&gt;
     &lt;/div&gt;
   &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I only want the vertical scroll to appear on the main div when the content within it exceeds the viewable area, it seems the margin-bottom on the main div is not working.</p>
  
  <p>Can anyone help me with this issue?</p>