position: fixed

WebHelper Joined: 30 Jul 2002 Posts: 56 Location: UK

I realise that it doesn't work on IE5.0 (not sure about 5.5 or 6). Looking at http://www.w3.org/Style/CSS/ it would seem W3 have achieve the frame-like effect of position: fixed using position: absolute. If anyone can tell me how they managed that, can you tell me, because I cant figure it out even after staring at it for several hours Neutral

Cheers,
Hertzsprung

Posted: Wed Feb 19, 2003 3:11 am (21 years, 2 months ago)

It doesn't work on IE 6 either, and it looks pretty sloppy to me in Netscape 6.2.3 (Win XP) as well, where the left ends of the darker dogears (that hold the links) for the right navbar (the parts of them that stick out of the navbar into the gutter) scroll along with the rest of the page, and break up, reappear, and refresh in a sort of random way as you scroll up and down.

My best guess is that the author either forgot to test his code in more than one browser, or else maybe uploaded the wrong version. The overridden style sheet says:

Quote:

The child selectors are a hack to hide these rules from WinIE6, which gets confused by 'fixed'

Considering the 'hack' doesn't work as claimed for IE 6, and that it looks so funky in NN6, I'd be pretty reluctant to spend much time figuring out how it was done. Did it look better in your version of Mozilla or NS6/7?

Anyway, you might try contacting the listed author: Author: Bert Bos <bert@w3.org>

I'd be curious if you find out anything interesting, and also why a supposedly authoritative page on CSS does such a strange job supporting the major browsers.

Posted: Thu Feb 20, 2003 10:34 am (21 years, 2 months ago)

Basically the W3C have started redesigning parts of the site to follow the CSS grammar rules - rather than use hacks in some cases - to compensate for either old version five browsers, or browsers like Micro$oft IE 6.0 that don't really follow the CSS rules correctly.

M$ IE 6.0 has a plethora of CSS bugs, it may claim to support CSS 2 however, nearly every day this year I am finding irritating holes while I am using CCS-P for example: {display: none} is not supposed to effect layout and thus does not generate boxes, unfortunately IE 6.0 thinks otherwise in some cases.

Basically the W3C uses threepart-f.css and threepart.css on that page; the workaround that sees to have been used is

Code:

body>div.map { position: fixed }

Although the W3C have made some careless mistakes with CSS-P this year and have had to fix their main 3 column layout tutorial.

Posted: Thu Feb 20, 2003 2:28 pm (21 years, 2 months ago)

I'd be the last to claim that IE6, Mozilla, and NN6/7 don't have lots of CSS bugs. But still, isn't it strange that he bothers to even use the 'hack' when it doesn't do anything?

WebHelper Joined: 30 Jul 2002 Posts: 56 Location: UK

Robert Wellock wrote:

M$ IE 6.0 has a plethora of CSS bugs, it may claim to support CSS 2 however, nearly every day this year I am finding irritating holes while I am using CCS-P for example: {display: none} is not supposed to effect layout and thus does not generate boxes, unfortunately IE 6.0 thinks otherwise in some cases.

What is this 'CCS-P' you talk of?

WebHelper Joined: 30 Jul 2002 Posts: 56 Location: UK

verto wrote:

I'd be curious if you find out anything interesting, and also why a supposedly authoritative page on CSS does such a strange job supporting the major browsers.

Works fine in moz0.9.9 through to moz1.3b Smile

I'm (perhaps foolishly) writing a page using headers, nav box and footers using positon: fixed. I /really/ dont want to resort to using frames, though I might end up using tables Sad

Posted: Thu Feb 20, 2003 3:44 pm (21 years, 2 months ago)

Hertzsprung wrote:

Works fine in moz0.9.9 through to moz1.3b Smile

Hmmm... that makes me wonder why it wasn't fixed in NN 6.2.3 then? Hopefully later versions of NN work better.

Hertzsprung wrote:

verto wrote:

... and also why a supposedly authoritative page on CSS does such a strange job supporting the major browsers.

Works fine in moz0.9.9 through to moz1.3b Smile

Not sure I'd call Mozilla a 'major' browser -- at least not in number of users. Am glad to hear that at least Mozilla works though. My confidence in the W3C was starting to sag a bit there. Still seems strange that they'd not support IE -- that's got to be the most major browser around, with probably about 85% market share depending on whose figures you go by.

Hertzsprung wrote:

I'm (perhaps foolishly) writing a page using headers, nav box and footers using positon: fixed. I /really/ dont want to resort to using frames, though I might end up using tables Sad

Might want to check NN6/7 if that's all you're going to support. Don't you write for IE either?

Posted: Thu Feb 20, 2003 5:47 pm (21 years, 2 months ago)

verto wrote:

Still seems strange that they'd not support IE -- that's got to be the most major browser around, with probably about 85% market share depending on whose figures you go by.

It's actually microsoft who don't support W3C, not the other way around. It wouldn't be right to base web standards on the MS way of doing things.

verto wrote:

Not sure I'd call Mozilla a 'major' browser -- at least not in number of users.

It may not have many users, but lots of browsers are based on it Very Happy

Posted: Thu Feb 20, 2003 10:51 pm (21 years, 2 months ago)

adam wrote:

verto wrote:

Still seems strange that they'd not support IE -- that's got to be the most major browser around, with probably about 85% market share depending on whose figures you go by.

It's actually microsoft who don't support W3C, not the other way around. It wouldn't be right to base web standards on the MS way of doing things.

I agree with you there, adam. What I actually meant to say in my post was that he didn't seem to even go to the trouble to check how it looked in IE, based on his hack not working. That's my idea of supporting a browser, anyway. If I'd noticed my own page not working in a major browser that way, I'd probably consider putting in a note that only shows up inside of noncompliant browsers, something like the way 'A List Apart' did at their site when they stopped supporting older browsers.

adam wrote:

verto wrote:

Not sure I'd call Mozilla a 'major' browser -- at least not in number of users.

It may not have many users, but lots of browsers are based on it Very Happy

Not to worry, adam -- wasn't dissing Mozilla either. Wink

However, I just ran into an article on one of the WASP's news feeds where they noticed the same page. They say:

WASP feed wrote:

ONE IN THE EYE FOR IE

It's official, it's standards-compliant and it doesn't work properly in Internet Explorer on Windows - welcome to the new Cascading Style Sheets (CSS) section at the World Wide Web Consortium (W3C)

The message of WaSP since it started has always been 'code to standards, build browsers to standards and everyone will be happy'. However, most high profile web sites are still wary of shutting anyone out in any small way, so it's very brave for the W3C to use a CSS property that fails in Win/IE - surely the browser that most of its visitors will use when visiting that page....

But the WASP article actually DOES go on to diss Mozilla and Netscape 7 ...

WASP feed wrote:

...In standards-compliant browsers, the navigation remains fixed (like a framed navigation area), while for Win/IE it disappears off the page as you scroll down. But wait for the irony. If you are using a standards-compliant browser and you are using a window size of 800x600 or less, you might never be able to get to links at the bottom. Personally, though, I can't think of any Mozilla/Netscape 7 users who would be running that kind of screen resolution ...

ONE IN THE EYE FOR IE (WASP item)

Posted: Thu Feb 20, 2003 11:05 pm (21 years, 2 months ago)

hmmm.... right now the page actually DOES display OK some of the time in IE -- at least when it's first opened. Maximizing and reloading messes things up again though.

Could a fix have been made?

Otherwise, perhaps that was the way it first loaded when authored, and a reason for the author missing the bad behavior in IE (?)

WebHelper Joined: 30 Jul 2002 Posts: 56 Location: UK

This is the response I received from the man himself, Bert Bos:

Quote:

I was looking at the new CSS page and trying to see how it managed the
>> frame-like effect of boxes being positioned relative to the viewport. I
>> understand that, in CSS2, position: fixed can be used to achieve this
>> effect, but it is supported by pitifully few browsers (especially

Depending on how you count It is actually supported by all current
major browsers (Opera, Mozilla, Konqueror, IE, as well as several
others) on all major platforms (Linux, Mac, Win), *except* by IE 5/6
on Windows.

Quote:

>> IE5/5.5/6). The page rendered quite badly in IE5 and IE6. Can you tell
>> me if there are workarounds for these browsers?

The work-around is to use absolute rather than fixed positioning. That
way at least it looks the same as long as you don't scroll... The
problem is that it is quite tricky to get WinIE to do absolute while
still providing fixed for other browsers. If you write

div {
position: absolute;
position: fixed }

IE is *supposed* to use the absolute, because it doesn't do fixed, but
IE has a bug that effectively makes fixed into an alias for static

However, this works:

div { position: absolute }
body>div { position: fixed }

(Assuming the DIV is a child of the BODY, adapt as needed.) Don't put
spaces around the ">", because that invokes another WinIE bug.

Unfortunately, just replacing fixed with absolute turned out not to be
enough on my page, as I recently discovered. It seems WinIE also has a
different idea of what 'em' means, and you may get overlapping text
for some font sizes and not for others. I'm still trying to find the
work-around for that. I increased the margins for IE, but the display
is not consistent across different installations of WinIE

Posted: Fri Feb 21, 2003 10:11 am (21 years, 2 months ago)

Hertzsprung, Cascading Style Sheet Positioning is sometimes referred to as "CSS-P" and normally relates to sites that use CSS to produce columnar layout rather than tables for example on my basic WVYFC site: http://www.xhtmlcoder.com/worthvalley/

Now Ian Lloyd's comment from the WaSP (The Web Standards Project) probably was influenced by an in-depth e-mail I sent him a few weeks back about why his site shouldn't use {cursor: hand;}. The explanation he gave, basically was because he had a narrow selection of web browsers obviously now he is using {cursor: pointer;}.

Thus concluding Ian wasn't running either; Opera 7.x, Netscape 6 or one of the modern Mozilla based browsers (or forgot to test to see if the code worked in one of those browsers) he already knew it wasn't valid CSS, which I find strange since his profession is web-development and he pushes accessibility.

WebHelper Joined: 30 Jul 2002 Posts: 56 Location: UK

Robert Wellock wrote:

Hertzsprung, Cascading Style Sheet Positioning is sometimes referred to as "CSS-P" and normally relates to sites that use CSS to produce columnar layout rather than tables for example on my basic WVYFC site: http://www.xhtmlcoder.com/worthvalley/

Ah, I see

Quote:

Now Ian Lloyd's comment from the WaSP (The Web Standards Project) probably was influenced by an in-depth e-mail I sent him a few weeks back about why his site shouldn't use {cursor: hand;}. The explanation he gave, basically was because he had a narrow selection of web browsers obviously now he is using {cursor: pointer;}.

Thus concluding Ian wasn't running either; Opera 7.x, Netscape 6 or one of the modern Mozilla based browsers (or forgot to test to see if the code worked in one of those browsers) he already knew it wasn't valid CSS, which I find strange since his profession is web-development and he pushes accessibility.

I'm not sure that using cursor: hand is such a great crime. I think that pages should be as accessible (and therefore standards-compliant) as is reasonable, but I see no harm in using proprietary tags/attributes as long as they do not drastically affect the rendering on other browsers.

} Wink

http://www.xhtmlcoder.com/[/quote]

WebHelper Joined: 30 Jul 2002 Posts: 56 Location: UK

If anyone's vaguely interested:

CSS2 implementation: http://www.ecs.soton.ac.uk/~js102/mezzo_web/
Frames implementation: http://www.ecs.soton.ac.uk/~js102/mezzo_web/frames/
Tables implementation: http://www.ecs.soton.ac.uk/~js102/mezzo_web/tables/

The frames closely matches the CSS2 implementation, if your browser isn't ... erm ... Mozilla.
The tables if the best I can manage. Does mozzy support overflow-y: scroll yet?

Posted: Fri Feb 21, 2003 5:50 pm (21 years, 2 months ago)

WASP feed wrote:

...In standards-compliant browsers, the navigation remains fixed (like a framed navigation area), while for Win/IE it disappears off the page as you scroll down. But wait for the irony. If you are using a standards-compliant browser and you are using a window size of 800x600 or less, you might never be able to get to links at the bottom. Personally, though, I can't think of any Mozilla/Netscape 7 users who would be running that kind of screen resolution ...

what is that even supposed to mean?