positioning a scrolled DIV after fluid content?

Hi,

I have a div with fluid content, below which I want a scrollable div.
I can't work out how to style the scrollable div to say "use the rest
of the space in the container".

The best I can come up with is having the scrollable div abolutely
positioned as in my demo, but this is horrible as it doesn't follow
the fluid stuff.

Demo here:

http://www.thebunnyshed.co.uk/test.htm

On 2007-06-05, lister <listerofsmeg01 (AT) hotmail (DOT) com> wrote:

Hi,

I have a div with fluid content, below which I want a scrollable div.
I can't work out how to style the scrollable div to say "use the rest
of the space in the container".

The best I can come up with is having the scrollable div abolutely
positioned as in my demo, but this is horrible as it doesn't follow
the fluid stuff.

I can't see a way of doing it without resorting to a table (or obviously
JavaScript but in my opinion using JS for layout is worse than using
tables for layout).

If you don't mind setting the height of .container to something (rather
than setting bottom) then it's possible.

What you want is for the computed value of top for .container to be its
"static position" which means the position where it would have gone if
it hadn't been positioned, which is just under the <h1>.

That is possible if you set top to auto, but you also need to set bottom
to auto. Otherwise the computed value for top is based on bottom and the
height. If bottom is auto, you will need to set the height, or it will
be based on the content, which will be far too high.

Demo here:

http://www.thebunnyshed.co.uk/test.htm