title: div stretch 100% page height regardless of content
body: <p><a href="http://parlourdc.com/wp" rel="noreferrer">live (work in progress) site</a></p>
  
  <p>Basically, I have all of my site's content centered within a div that is a specified width and an intended height of 100% regardless of the actual length of the content. I've specified <code>height:100%;</code> for <code>html</code>, <code>body</code>, and <code>#main</code> however the div still comes up short as seen on <a href="http://parlourdc.com/wp/products" rel="noreferrer">this page</a>- I don't want their to be any gap between the <code>#main</code>'s grey box and the bottom of the screen. Is this possible? How?</p>