Help coding a scrolling div with variable height

HTML & CSS
1

I’m trying to create a scrolling div with the position:absolute property, and I’m having a problem getting the HTML to work right.

The files in the attached archive illustrate what I’ve got so far. You can see the result at http://jhsachs.com/f/FixedParts.html.

The div scrolls as it should, but its size is fixed. The width is supposed to be fixed, but I want the height to resize with the window. Can anyone show me how to do that without breaking the scrolling?

2

Trying the following

html {
    height: 100%;
    min-height: 100%;
}

body {
    height: 100%;
    margin: 0;
}

#mainContainer {
    height: 100%;
}
3

Chris, thanks for your interest. That made a difference, but it didn’t produce the result I wanted. The maincontainer div extends to the bottom of the page, but the scrolling area’s height is still fixed.

I tried adding height:100% to bodyOuter, but that made no difference, and when I added it to bodyInner the content ceased to appear.

In case it matters, I was using Firefox 10.