title: HTML: Header + Footer + Fluid Content with certain specifications
body: <p>I need to create a webpage, with a normal header + sticky footer + fluid body content stretched vertically.
  However, these positions can't be absolute, as I need a page min-height of 780px.</p>
  
  <p>I managed to acomplish this using tables, but I really want to avoid using them. Also I'd like to avoid the usage of JS or jQuery.
  The sticky footer is only sticky until min-height is reached.</p>
  
  <p>Sorry for all these specific terms, it's just that I'm struggling with this for quite some time. I've tried the usual sticky footer layout with the pusher , but my main content isn't stretched when I use height: 100% (it seems there's a bug when the wrapper uses height: auto).</p>
  
  <p>Example image of what should happen: <a href="http://s22.postimg.org/6fvdd4mxd/layout.png" rel="nofollow">http://s22.postimg.org/6fvdd4mxd/layout.png</a></p>
  
  <p>JS Fiddle to show what I have right now:
  <a href="http://jsfiddle.net/6qatg/" rel="nofollow">http://jsfiddle.net/6qatg/</a></p>
  
  <p>The code:</p>
  
  <pre><code>&lt;body&gt;
      &lt;table class="wrapper"&gt;
          &lt;tr&gt;&lt;td id="topBar" class="topBar"&gt;
  
          &lt;/td&gt;&lt;/tr&gt;
  
          &lt;tr&gt;&lt;td valign="top" id="mainContent" class="mainContent"&gt;  
          &lt;/td&gt;&lt;/tr&gt;
  
          &lt;tr&gt;&lt;td class="footer" id="footer"&gt;
          &lt;/td&gt;&lt;/tr&gt;
  
      &lt;/table&gt;
  &lt;/body&gt;
  
  html{
      min-width: 790px;
      min-height: 300px;
      font-family: 'Open Sans', sans-serif;
      height: 100%;
  }
  
  body{
      font-family: 'Open Sans', sans-serif;
      /*border: 2px solid black;*/
      height: 100%;
      min-height: 300px;
      min-width: 790px;
  }
  *{
      margin: 0;
  }
  
  .wrapper {
      height: 100%;
      width: 100%;
  }
  .footer {
      height: 35px;
      background-color: #00F8FD;
      width: 100%;
  }
  
  .topBar{
      height: 75px;
      width: 100%;
      background-color: #00F8FD;
  }
  
  .mainContent{
      background-color: #EEF8FD;
      height: 100%;
  }
  </code></pre>
  
  <p>Thanks in advance.</p>