Question

I’m trying to create a scrollable left column that takes up 100% of the remaining space, minus the distance from the top of the page. It works well currently, but there’s a few issues. When I initially created it, I ran into an infinite scrolling issue because I wasn’t taking into account the footer height:

http://jsfiddle.net/sUqtD/5/

If I subtract the height of the footer:

http://jsfiddle.net/sUqtD/4/

it works to an extent, but if I resize the browser height, and the right column height pushes the footer down, the left column height still takes into account the footer height.

So my question, how can I get the left column to take up 100% remaining height in all conditions?

Answer 1

Try something like that: http://jsfiddle.net/mXjLE/1/

Its not code perfect, but it works (I things).