Hi all,

I'm trying to achieve a layout which uses CSS (and JavaScript if necessary) to create a layout which encompasses a browsers viewport with 100% width and height and at the same time have scrollable content within the main and sidebar area.

Has anyone got any idea on how to accomplish this (if it can be done)?

Looking for support across all major browsers (IE7+).

I have also attached a mock up of what I'm trying to achieve.


Has any one got any ideas on how to do this?

1 answer

Ktash 1851

Actually, if you only are supporting IE 7+, than I would recommend Conflicting Absolute Positions as it would probably be the easiest to do. This will allow you to do things either flush against the containing elements, or with some 'padding'. Really though, there are a lot of ways to do achieve that. Another way would be a containing div that is overflow auto, and percentage based on browser size. But, like I said, for your situation, I think I'd personally prefer the Conflicting Absolute Positions.

Answered over 8 years ago by Ktash