Div height problems

[groovyjames]

The problem I am having is sometimes the main DIV "maincont" doesn't always stretch to the height of the page if there is not enough content to make the DIV stretch to the length of the page or longer there is a horrid gap and you can see the background.

For example there isn't enough content to make the DIV stretch to the height of the page so there is a big gap.

But on the front page (56k warning there is some big images) there is more than enough content so there is no gap.

I have tried putting 'height: 100%;' in my style sheet but then the problem is the oppisite happens. On pages where there is not enough content to stretch the DIV, the DIV stretches to the height of the page. But on the front page, where there is more than enough content to stretch the page, there is a big gap.

So that didn't work. Is there anyway I can make the DIV stretch to 100% (the height of the page) regardless of how much content is in the DIV?

the CSS file can be found here.

[pyrodragon]

specify the following for the body:
[minicode]margin-top:0px;[/minicode]
and this will correct the error

[groovyjames]

margin-top:0px; doesn't work unless I'm missing something...

[pyrodragon]

my bad i know what is wrong there is not enough content so specify
vertical-align:top; in the style attribute of the element.

[groovyjames]

I got it to work kinda, but as always IE is being a ppain in the back side and is refusing to render the page properly. There is still the gap problem in IE, nothing I have tried has worked.
Does anyone know how to fix this problem in IE?