title: Sidebar height 100% on div not extending to bottom of page
body: <p>I've seen several similar questions/answers to this problem on SO but none of the answers that I've checked have helped me.</p>
  
  <p>I'm attempting to have a "Side-Bar" extend from 10px less than the top of the page, all the way to the bottom. </p>
  
  <p>However (when using height:100%), the "Side-Bar" only reaches to the bottom of the loaded browser window, if there is content past the browser window that you scroll down to, the "Side-Bar" ends prematurely.</p>
  
  <p>Basically, its height is only 100% of the browser window, I desire it to be 100% of the full page content.</p>
  
  <p>I've created a JSFiddle that shows my problem:</p>
  
  <p><a href="http://jsfiddle.net/qaEzz/1/" rel="nofollow">http://jsfiddle.net/qaEzz/1/</a></p>
  
  <p>My CSS:</p>
  
  <pre><code>#sidebar {
    position:absolute;
    right:8px;
    width:200px;
    height:100%;
    overflow:hidden;
    background-color: yellow;
  }
  </code></pre>