Trouble filling a gap between 2 div's

Fill up gap between 2 div's?

[Rope]

Hi people,

First of all I'm new here and dutch. So if my English is not clear or the question needs to be explained any further please let me know.

So here's the question.

I have a page in which I have the following HTML:

<div id="page">
<div id="header">
<a><img src="some_header.png"></a>
</div>
<div id="pageboxtop">
<div id="pageboxleft">
<div id="pageboxright">
<div id="pagetopleft">
<div id="pagetopright">
<p>
Actual content will be placed here. Why is explained below.
</p>
</div>
</div>
</div>
</div>
</div>
<div id="footer">
<p>
Some footer text.
</p>
</div>
</div>

So that's the HTML. I use the several page div's to create a box with round curves, I do this by placing images as the background.

Now the problem comes I have the CSS to put the footer at the bottom of the page at ALL times. However I cannot seem to get the " pagetopright" div to fill up the gap between the two div's (header and footer).
I've tried it all, min-height = 100%; height = auto; etc etc.
What I'm doing now is using a bit of javascript I wrote to get the "pagetopright" div to take the right size en fill the gap between the header and footer div's.

I don't have the CSS I'm currently using with me now because I'm at work. I'll post that later.
I do however have the link to the page I'm talking about(which doesn't contain the most up-2-date CSS).
Which is: <snip>
If you look at it you'll see the footer div at the bottom of the content div, but not at the bottom of the page. Also the content div is not resizing to fill up the page.

So the main points are:
-Have the footer div reside at the bottom of the page, regardless of the size of the content.
-Have the content div (in this case the "pagetopright" div), fill up the gap between the 2 div's.
-Have the content div only have to fill up the gap between the 2 div's if the "content" of the content div is
smaller than the browser window.

I hope you get what I want.

Best regards, Rope.

[edited by: engine at 9:59 am (utc) on Oct. 10, 2008]
[edit reason] See CSS Charter [/edit]

[BadBoyMcCoy]

do you mean you want the footer at the bottom of the browser window no matter what? If so you you can put this css

div#footer {
width:100%;
height:20px;
position:fixed;
bottom:0px;
left:0px;
}

make sure the footer is at the bottom of html. and then your footer should be positioned at the bottom of the screen no matter what the browser window (even as you scroll up and down the page) The only problem with this is that there is no ie6 support for "position:fixed;" so you may need a seperate ie6 stylesheet to come up with a workaround.