I need DIV with scroll inside, and it should be 100% height of browser view,
also need another DIV at the bottom with position absolute (fixed is not an option)
is this can be done?
+-ooo----------------------------------+
| Web Browser |
+--------------------------------------+
| |
| BODY overflow:hidden |
| |
| |
| DIV WITH SCROLL INSIDE IT |
| height:100% (of window) |
| overflow: scroll |
| |
| |
| |
+--------------------------------------+
| Fixed DIV height:50px |
+--------------------------------------+
I think if you position that div at the bottom, it may appear above the main content area.
You can achive the 100% height with this CSS though:
And then set the overflow on the content div. The tricky part will be getting the fixed div at the bottom to not overlap. The only way you’re going to get that in a cross-browser manner is to use Javascript to detect the height of the available window at the start, subtract the 50px from that, and set that height on the content div. You’ll probably need to add an onresize event handler in there too to handle the cases when a user resizes the browser window.