CSS height 100% of page height?

SO I'm trying to make an all CSS lightbox such as the one on this page CSS Lightbox

but when the page is scrollable do to the height of it, and the user scrolls down, the fade stops, is there a way to stop this from happening?? So the fade covers the whole page regardless if they开发者_Go百科 scroll or not..

THanks,

Change

.black_overlay {
display: none;
position: absolute;

to

.black_overlay {
display: none;
position: fixed;

I usually grab the height and width of the originating page's body and set the height/width of the fade to those dimensions using Javascript before I add it to the page. Are you looking for a CSS only option or would you be willing to use a bit of JS?