How can I make my fixed position work in IE6?

Question

I've have tried this:

body {height: 100%;overflow: auto; body #cornerImage {position: absolute;bottom: 0;}

and this:

{ margin:0; padding:0; }
html, body {
    height: 100%;
    overflow:auto;
}
body #fixedElement {
    position:fixed !important;
    position: absolute; /*ie6 and above*/
    bottom: 0;
}

Neither of these have worked. It seems like the position I am wanting is working, but the problem is there a giant margin pushing my content down. Am I on the right track with this? Or is this not the fix I should be trying?

Answer 1

IE6 simply does not support position fixed. It's been a hassle many web developers have had to live with. I've used two alternatives:

• Put the scrollable portion of my content in a separate 100% width/height DIV with overflow: scroll. Then overlay my non-scrollable "fixed" element in a separate div with a greater z-index.

• Do what Yelp does with the map on the sidebar and reposition the element with Javascript every time the user scrolls.