title: CSS - Height of div = 100%, -20px
body: <p>Okay, so I've read some other people have had this problem, but they either resorted to JS or the solution just wouldn't work for me.</p>
  
  <p>I have this:</p>
  
  <pre><code>// The Header //
  /*            */
  /*  CONTENT   */
  /*            */
  // The footer //
  </code></pre>
  
  <p>Currently the work in progress can be found at:<br/>
  <a href="http://newsite.carlsimmons.co.uk/" rel="nofollow">http://newsite.carlsimmons.co.uk/</a></p>
  
  <p>It's working as intended, apart from the always present vertical scroll bar. This is because the content's height is set to 100%, +header &amp; footer height and you're left with something always bigger than the page.</p>
  
  <p>I have tried the absolute option (among plenty of others), but they all have faults or don't work. Just thinking there must be some way to achieve this surely? I guess I shouldn't be too afraid of using JS for this, since it would still look fine for people with JS, but not exactly good practice and might cause some lag on browser resizing.</p>