this div to cover up the viewport works perfect on IE 7, 8, FF, Chrome, and Safari, but why not IE 6?

Question

this div to cover up the viewport works perfect on IE 7, 8, FF, Chrome, and Safari, but why not IE 6?

http://www.0011.com/css/test/cover_up/i4.html

I thought IE 6 breaks if it is position: fixed but not absolute?

(on IE 6, the div is only 1 line tall).

Answer 1

Try this CSS

body,
html {
    width: 100%;
    height: 100%;
}

Answer 2

Alex's suggestion works 99%:

http://www.0011.com/css/test/cover_up/i4b.html

however,

1) scrollbar pops up when the cover div appears

2) how come the absolutely positioned div doesn't have a height of the viewport on IE 6? I thought the spec says when there is no nearest ancestor that is "positioned", then the viewport is the containing element. IE 6 doesn't follow the spec on this again?

Answer 3

IE6 does not interpret object element height like other browsers, so you can't really use 'height=100%'. Sadly, the only way I know of to address this issue is to use javascript to determine the width and height of the viewable window in pixels, then set 'min-width' and 'min-height' stylings to these values.

This link should help you find what you're looking for.