How create a div that's position is fixed compatible with IE, FF & Chrome

I have fixed(position) on the left. It has style="overflow: auto" and then the rest of articles go to the right which is scrollable.

Some of options in the sidenav is not visible in IE and FF. I understand that Browser view port are different for different browsers. How can I adjust the height of sidenav so that all options are visible.

I ap开发者_JAVA百科preciate any help.

Thanks.

add overflow-y:auto to the sidenav, this will make the sidenav content scrollable when the height of the viewport is lesser than that of the content in sidenav.

See if this helps:

http://jsbin.com/ixula4

What I've done is that that I added top: 0; height: 100% to the fixed positioned div along with overflow: auto. Seems to work in FF, Chrome and IE7 (standards-compliance mode). Not sure about other browsers. You better research on "100% height divs" for hacks you can use in other browsers.

You could try to use overflow:visible instead of auto.

Also fixed is not supported on older IE only from IE7+.

Do you have an example page to look at?

This article seems very helpful for you because their demo appears to be what you are trying to do. http://cross-browser.com/x/examples/floater_fixed.html Offers a cross-browser position:fixed solution.