CODEWITHSUNDEEP
cssinternet-explorer-6
Fuego DeBassi
Fuego DeBassi

Reputation: 3017

IE6 Fixed Positioning

I need to fix a footer to the bottom of the viewport. IE 6 is the problem--and yes, it must work in IE 6. That much, is not my call.

Using this: 

div#footer {
 width:1020px;
 position: absolute; 
 top: expression(0+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px'); 
 left: expression(50%+((e=document.documentElement.scrollLeft)?e:document.body.scrollLeft)+'px');} 
}

In my IE6.css I can fix the footer to the top of the page. But if I switch it to this: 

div#footer {
 width:1020px;
 position: absolute; 
 bottom: expression(0+((e=document.documentElement.scrollBottom)?e:document.body.scrollBottom)+'px'); 
 left: expression(50%+((e=document.documentElement.scrollLeft)?e:document.body.scrollLeft)+'px');} 
}

It goes haywire. Am I implementing the expression function wrong for fixing it to the bottom of the viewport?

Thanks!

Upvotes: 0

Views: 980

Answers (2)

Mike
Mike

Reputation: 4287

Don't use the expression clause. From my experience it can render the page a little on the slow side and behaves oddly. Some times it'll work and others it'll simply fail not gracefully.

I've had good success with these methods.

But without seeing your entire page it's a little harder to see if any of the links I provided will get in the way of your current stylesheet.

Upvotes: 2

Preston Marshall
Preston Marshall

Reputation: 1195

Try using this instead of expressions:

* {
    margin: 0;
}
html, body {
    height: 100%;
    overflow: auto;
}
.wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
}
.box {
    position: fixed;
    left: 50%;
    top: 180px;
    margin: 0 0 0 -370px;
}
* html .box { 
    position: absolute;
}

/*

Fixed Positioning in IE6 
http://ryanfait.com/

*/

Upvotes: 1

Related Questions