jerschmidt14@gmail.com wrote:
[color=blue]
> I am trying to get a page with navigation menus working in CSS. The
> following HTML works fine in Firefox, but renders very ugly in IE. IE
> does not extend the left bar from the top of the screen to the buttom,
> Firefox works ok. Any ideas? I got the example from
>
http://www.w3.org/TR/REC-CSS2/visuren.html, I have added background
> coloring to show the problem.
>
> Jeremy[/color]
(snip HTML)
Jeremy,
Your interpretation of the W3C spec appears to be flawless.
Unfortunately, the same cannot be said for all browsers:
Firefox (actually Netscape 8.1 in Firefox mode) seems to get it right.
Opera does OK, but seem to have trouble correctly rendering the height:
auto on the leftside bar if the screen height is changed.
Amaya doesn't display the 'main' section at all. Their support matrix
says that "Fixed position is managed as absolute position." at the
present time (and they haven't answered my query about what that means),
so we can't expect too much.
IE 6 flat does not support position: fixed. I don't know about IE 7.
The moral of this story is that before you become too attached to a
particular CSS function, you need to get some idea of how well supported
it is. You have just done that...
P.S. You've specified a body height of 8.5 inches and state that it is
required in order for you to use percentages. You might try a height of
100% on body instead. Even on Firefox and Opera I see a vertical scroll
bar which the user can move up and down but which has no effect on the
display (since everything is fixed-positioned). Changing the body
height might get rid of that.
P.P.S. I can't help wondering what is going to happen to TEXT within
this layout if the user either makes the text size larger or the window
smaller. I think it will not be good.
Chris Beall
CSS
