help w/ pos:fixed; overflow:scroll

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Ingrid - 26 Jun 2004 19:22 GMT

Dear group,

I wanted to make a scrollable list-menu that is fixed in place and fitted to the height of the browser window, so I tried:

ol#nav{
position: fixed;
top: 2em; bottom: 0; height: auto;
left: 0; width: 12em; right: auto;
overflow: scroll;
}

Or should I set the menu-list's parent DIV to "position: fixed; overflow: scroll" instead?

Any tips?

thank you! -- ingrid

Reply to this Message

Brian - 27 Jun 2004 17:00 GMT

> I wanted to make a scrollable list-menu that
> is fixed in place and fitted to the height of
[quoted text clipped - 6 lines]
> overflow: scroll;
> }

I'm not sure what you want; perhaps you want height: 20em;
overflow: scroll?

Signature

Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/

Reply to this Message

Ingrid - 27 Jun 2004 21:48 GMT

>I'm not sure what you want; perhaps you want height: 20em; >overflow:

scroll?

Hi Brian! Thanks for the reply.

I was thinking that {position: fixed; top: 0; bottom: 0; height: auto;
overflow: scroll;} would make a fixed, scrollable list that is exactly
as tall as the browser window:

http://www1.asstr.org/~ingrid/joesguide-authors.html
-- warning! slightly naughty text content (but no pictures)

In Camino, I can get the effect I want by applying those rules
("position: fixed; overflow: scroll;...") to the list itself or to the
DIV that contains the list; I don't know if there's any advantage to
doing it one way versus the other.

I'm a little worried that it might not show right in old and sloppy

Reply to this Message

Brian - 28 Jun 2004 01:17 GMT

> I was thinking that {position: fixed; top: 0; bottom: 0; height: auto;
> overflow: scroll;} would make a fixed, scrollable list that is exactly
> as tall as the browser window:
>
> http://www1.asstr.org/~ingrid/joesguide-authors.html

Works in Firefox 0.8/Win xp.

> In Camino, I can get the effect I want by applying those rules
> ("position: fixed; overflow: scroll;...") to the list itself or to the
> DIV that contains the list; I don't know if there's any advantage to
> doing it one way versus the other.

If you'd like, put up a test case with the alternate approach, and let
us Windoze users try them both.

> I'm a little worried that it might not show right in old and sloppy
> browsers.

Your worries are well-founded with position: fixed. Many browsers
choke on it. Hide it from Netcape 4 and IE 4 using @import; hide it
from IE 5-6/Win by using a child selector; if there are links in the
list, then also hide it from IE 5/Mac using @media.

Signature

Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / June 2004

help w/ pos:fixed; overflow:scroll