CSS question

defenstration

Is there any way of positioning a stylesheet in relation to the bottom of the page rather than the top? If I'm not explaining myself well, here's my code:

#HEADER {
position:absolute;
top:13px;
left:0px;
width:100%;
height:90px;
text-align:center;
background:#FFFFFF;
overflow:hidden;
}

#MENU {
position:absolute;
top:116px;
left:50%;
margin-left:-382px;
width:764px;
height:25px;
text-align:center;
background:#000099;
overflow:hidden;
}

#CONTENTCONTAINER {
position:absolute;
top:154px;
left:50%;
margin-left:-382px;
width:764px;
height:71%;
text-align:justify;
background:#FFFFFF;
overflow:auto;
}

#CONTENT {
padding-left:15px;
padding-right:15px;
}

As you can see, I have all the stylesheet heights measured in pixels instead of CONTENTCONTAINER, which is in % so as to allow for screens of different resolutions.

Now though I want to add another stylesheet (FOOTER) onto the bottom, underneath the CONTENTCONTAINER, but because there is a combination of pixels and % in the stylesheet heights, I have no way of measuring exactly how far from the top of the page I should be starting my FOOTER stylesheet. So is there a way of positioning a stylesheet in relation to the bottom of the page instead of in relation to the bottom?
I tried something like the following and a few other things, but no luck:

#FOOTER {
position:absolute;
bottom:35px;
left:50%;
margin-left:-382px;
width:764px;
height:25px;
text-align:center;
background:#000099;
overflow:hidden;
}

Cheers in advance...

stevenmu

No, there isn't a 'bottom' property you can set, and you reall wouldn't want to in case someone doesn't have there window as high as you expect, it would keep the footer relative to the bottom of the window bringing it up sitting over/under other content. Looking at what you already gave there, and assuming your #content div is nested inside your #contentcontainer, could you nest your #footer in #contentcontainer after #content, and give both #content and #footer, maybe giving them % heights, say 80%/20%. Other than that I'd suggest an extra div to surround the whole page, then have all the divs you already have within that, and the #footer at the bottom of it.

Evil Phil

I'll just move this over to the webmaster forum.

zAbbo

Maybe a link to the test page will help ?

Absolute positioning can be difficult to work with.

defenstration

Yeah was thinking that nesting it inside the CONTENTCONTAINER might be another option alright.

To see an example, go to http://www.fenians.ie/feniansnews.htm
What I want to do is just add a footer to that page.

Cheers for the help so far lads...