Lightbox2 doesnt like IE8

Question

view my page: http://tonyperson.com/art4art

click on the picture (woman study 01) in IE8 and the transparent black background does not go all the way down the page.... any help is appreciated!

I have tried many things in css like changing the height to 100% for the overlay div, etc...

Answer 1

Change the position: absolute on your .content div to position: relative.

The absolute positioning of it takes it (and thus the entire page's contents) out of the flow, collapsing the body down to a height of 0. You can verify that by checking e.g. document.body.scrollHeight.

Since Lightbox then sees the body has no height, it only bothers adding the overlay to one screen-full.

Edit: As a work-around for the problem noted in the comments (the overlay still doesn't cover everything when the lightbox extends below the bottom of the original page), you could add some extra padding to the bottom of the page.

Answer 2

I made a tricky trick here, just convert the position:absolut to position:fixed so the overlay at a screen size can be moved by the directional bars when going down or up, it will give you the feeling that overlay covered all the page.

Answer 3

it works! with position:fixed :)