title: Why is 100% height not 100% of the browser height?
body: <p>EDIT:<strong>Removed the files from the server</strong></p>
  
  <p><a href="http://www.jdxsolutions.com/newsite/index.html" rel="noreferrer">http://www.jdxsolutions.com/newsite/index.html</a><br>
  <a href="http://www.jdxsolutions.com/newsite/default.css" rel="noreferrer">http://www.jdxsolutions.com/newsite/default.css</a></p>
  
  <p>This is a layout I've been using to try out some stuff. What's got me stumped is that when the browser is resized so a vertical scroll-bar appears, the background doesn't reach the full height of the browser window... in fact they are shorter than the content panel, despite being set as height:100%.</p>
  
  <p>This happens in IE8, FF3 and Chrome so it's clearly a pretty standard-compliant screw-up (passes validation for XHTML 1.0 strict and CSS2.1+)! Can anyone point out the obvious mistake?</p>
  
  <p>EDIT: I looked at it in Firebug as suggested. What I find is the page div sticks out past the bottom of the parent pageOutline div. How can that work?</p>