I know that position:fixed;
was not supported by IE until IE 7, and it only works in IE 7 if you have a STRICT DOCTYPE
.
My question is: "How do I get it work with IE 7 with TRANSITIONAL DOCTYPE
?"
Please don't suggest changing a DOCTYPE
, as this does not answer my question, thank you.
In CSS Position Fixed, fixed is a value applied with position property. This position property is used to align the elements at the desired location. This fixed position always sticks to a specific location and it can’t be moved any side of the page. Even we minimize or maximize the page also its position fixed only.
IE6 doesn't support position fixed. If you really need this to work in IE6, use conditional comments to serve an IE only CSS file and fake position:fixed with CSS expressions. (edited to correct IE version info.) Show activity on this post. I recently wrote a jQuery plugin to get position:fixed working in IE 6+.
A fixed element does not leave a gap in the page where it would normally have been located. Notice the fixed element in the lower-right corner of the page. Here is the CSS that is used: Example. div.fixed {. position: fixed; bottom: 0; right: 0; width: 300px;
There are five different position values: static; relative; fixed; absolute; sticky; Elements are then positioned using the top, bottom, left, and right properties. However, these properties will not work unless the position property is set first. They also work differently depending on the position value.
You don't need a Strict DOCTYPE for fixed
support. You only need a DOCTYPE that triggers Standards Mode (or ‘almost standards’). That can be a transitional doctype such as:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
or XHTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
as long as the system ID (the URI at the end) is included.
If your pages really are relying on Quirks Mode (ugh!), I'm sorry but you cannot use fixed
and will have to resort to JavaScript hacks (but then you might need those for IE6 anyway).
Fixed position does not work for me even with the Transitional/Strict Doc types. However I am using IE9 in compatibility mode and that is suppose to render using the IE8 runtime libraries. To fix this issue I had to add the following CSS to element.
.elementToBeFixed {
position: fixed;
top: 0;
left: 0;
}
It does not work with Top or Left being missing you have to explicitly set them to zero (or your desired value) for it to work in all versions of IE....Needless to say IE sucks.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With