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?
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.