title: For div to extend full height
body: <p>Is there a method I can use for a div to extend to full height? I've got a sticky footer in it as well.</p>
  
  <p>Here's the web page: <strong>Website removed</strong>. The middle bit I'm talking about is the white div, midcontent which has CSS values:</p>
  
  <pre><code>.midcontent{
       width:85%;
       margin:0 auto;
       padding:10px 20px;
       padding-top:0;
       background-color:#FFF;
       overflow:hidden;
       min-height:100%;
       max-width:968px; 
       height:100%;
  }
  </code></pre>
  
  <p>So yes, obviously <code>height:100%</code> didn't work. Additionally, ALL parent containers have height set.</p>
  
  <p>Here's the general structure</p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="wrap"&gt;
          &lt;div id="main"&gt;
              &lt;div class="headout"&gt;
                  &lt;div class="headimg"&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="midcontainer"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="footer"&gt;
          &lt;div class="footer"&gt;&lt;/div&gt;
      &lt;/div&gt;
  </code></pre>