Forum Moderators: not2easy
I'm using IE's CSS expressions to emulate POSITION:fixed on a few elements, and it is working quite nicely. That is, until I removed my!DOCTYPE statement to test it in quirks mode. Then it blew up and acted is if the elements were just positioned absolute.
A Google search found several people have the problem of expressions working fine in quirks mode, but failing when the!DOCTYPE was applied. It didn't appear anyone ever found a resolution though, so I pose the question here.
#Measure
{
POSITION: fixed;
TOP: 0px;
LEFT: 0px;
HEIGHT: 390px;
WIDTH: 766px;
BORDER: #f00 1px solid;
}
* html body #Measure
{
POSITION: absolute;
TOP: expression(documentElement.scrollTop);
}
This bit of CSS works perfectly well in IE in compliant mode, but fails without the!DOCTYPE being declared.
Can anyone sahed some light on this for me?
Thanks,
-Lance
Quirks mode is just that, quirks mode. A browser in quirks mode has no standards (which implies: no guidelines) on how to interpret the code and will render it in it's own, quirky, way.
Expressions working in quirks mode and failing in compliant mode are wrong expressions :) Don' try to understand quirks mode, it just plain sucks ;)
If it works (preferrably chross-browser) and validates with a doctype, then don't change it.
If you take a look at the statistics at counter.com [thecounter.com], IE 5.x is still used more than all other browsers combined with the exception of IE6.
* html body #Measure
{
POSITION: absolute;
TOP: expression(offsetParent.scrollTop);
}
It seems IE in compliant mode uses document.documentElement to access the <html> element as the root of the document while IE < 6 uses document.body as the root. Using offsetParent will read an object's parent regardless of what it is.
This method allows you to emulate POSITION:fixed; and it's even flicker-free.
