Re: [css-d] Please help me fix a DIV's position vertically but not horizontally.
Hi all, Thank you, Georg, for having taken time to answer me. It's a pity that what I desired is not possible, whereas I started to think that CSS makes everything possible :-) I decided to place my left-side menu with absolute position and put the right-side of the page into an iframe. Thus the menu is always visible when the user scrolls down, but also when he scrolls left, which makes him unable to benefit from the full width of his browser window to read the true content... unfortunately. I would like to get rid of that iframe, though, but keeping the same effects. I read of overflow: auto; to make a scrollable div. This would be ideal for me if only I was able to set the dimensions of that div as follows: height: height of the viewport; width: width of the viewport - width of the left-side menu; If I use height: 100%; then my scrollable div (which has the longest content on the page) is taken as the reference for the total height of the page. And then, the left-side menu disappears when I scroll down... I could use position: fixed; for the menu, but then we are back to the original problem: when horizontal scrolling is performed, then the menu overlaps the content... I have googled quite extensively (but not enough ?) about viewport dimensions, but I did not find any solution. Has anyone any idea of how I could achieve with CSS stuff only the same effects as with my iframe ? (I would really appreciate to avoid this iframe, because the content needs already two files, plus the - cached - images...) I would like to avoid tables too for pure CSS, but that is another matter, and I guess I should post with another subject... Thanks in advance, Philippe PS: The test page can be found at http://graal.ens-lyon.fr/~pcombes/MUMPS_test/test.html It is emacs-made and fully commented because it is ought to be maintained by people who do not know CSS (but with good experience of programming...) So if anyone have time to have a look at it and give some comments, they would be very welcome. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Please help me fix a DIV's position vertically but not horizontally.
Philippe Combes wrote: One year ago, Georg replied with a link to one of his own pages, where a menu behaves a bit as I would like it for mine, even if on the right side: http://www.gunlaug.no/contents/toc_7a.html The difference is that I would like my menu to scroll horizontally just as if it was defined with position: absolute;. Say, position fixed on y-axis and absolute on x-axis. The effect you're after can not be easily achieved with CSS alone as of today, since an element can't really be given two different references - one to the browser-window (fixed) and one to the page (absolute). My example does actually behave as you want, but _only_ in IE6 and below, and _only_ when javascript-support is on. IE6 and older don't support position: fixed at all, and is therefore given the fix described here... http://www.gunlaug.no/contents/wd_additions_15.html ...where fixed elements are absolute positioned horizontally relative to the page, and an IE-expression dynamically feeds them vertical offset-position based on where the page-top is relative to the window when the page is scrolled. I tried to find out my way amongst all the CSS code associated to Georg's page, to see if I was able to modify something to get the desired behaviour, but I quickly got lost: I have started to learn and work with CSS 10 days ago... No surprise you got lost then, as neither my stylesheets nor my markup is particularly beginner-friendly :-) My solution gets around the problem with position: fixed lining up correctly in max-width restricted pages - by using nested elements and complex styling, but the overlapping on narrow windows problem is unsolved - except in IE6 and older. Expressions never made it into CSS, and no alternative to them have made it either - at least not yet. Consequently: the effect you're after can be made to work (somewhat) by having a script inject new position-values for the fixed element based on page's position and dimensions relative to the window / viewport. There is an alternative method: reverse the IE6 solution described here... http://www.gunlaug.no/contents/wd_additions_17.html ...to work in all browsers. Some sites use such a method. However, that method messes up the back-button functionality under certain conditions in existing IE/win versions, so I haven't taken it any further. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Please help me fix a DIV's position vertically but not horizontally.
Hi all, This is an old thread I found in the archives of this mailing list. I have exactly the same problem. I want my menu to remain on the left side of the viewport, even when the user scrolls down the page. But if he scrolls right because the window is too narrow, then I have the overlapping effects mentioned in the old posts of this thread. One year ago, Georg replied with a link to one of his own pages, where a menu behaves a bit as I would like it for mine, even if on the right side: http://www.gunlaug.no/contents/toc_7a.html The difference is that I would like my menu to scroll horizontally just as if it was defined with position: absolute;. Say, position fixed on y-axis and absolute on x-axis. I tried to find out my way amongst all the CSS code associated to Georg's page, to see if I was able to modify something to get the desired behaviour, but I quickly got lost: I have started to learn and work with CSS 10 days ago... I would greatly appreciate any help. Thanks in advance ! Philippe PS: Here is a pointer to the page that should be the basis of a site I am trying to modernize a bit. By the way, if some could tell me why my vertical bar does not scale to the height of the content on its right side when the default size is small, it would be very helpful too ! And of course, comments and suggestions about anything else on this pages are welcome !!! http://graal.ens-lyon.fr/~pcombes/MUMPS_test/dwnld.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
