Bottom positioning with CSS

[baybook]

I'm looking through the old posts and from what I'm reading it looks like there is now way to position a footer to ALWAYS be at the bottom of a page unless the page is a static length.

Is this correct? The headers(top of page)

I have taken out my position:absolute in the footer and the layer that is holding everything, but then everything moves to the top.

Please advise. Thanks!! Here is a snippet of the stype sheet.

_____________________________
.footer{
position:absolute;
text-align:center;
background-image:url(images/bk_space.jpg);
bottom:10px;
width:710px;
left: 0px;
}

.secondheader{
position:absolute;
left: 0px;
width:710px;
height:39px;
top:100px;
}
.header{
position:absolute;
width:710px;
height:100px;
left: 0px;
top: 0px;
}

.container{
height:425px;
width:710px;
left:10px;
top:0px;
position:absolute;
z-index:1;
}

 

[stormbind]

This is a gamble.

position:absolute;
top:expression(document.body.offsetHeight);

--Glen

Memoria mihi benigna erit qui eam perscribam

 

[Borvik]

If I'm not mistaken expressions and javascript in CSS only works in IE. Please let me know if I'm wrong - as it would greatly help me reduce code on my site.

But I think the easiest way to keep a footer at the bottom of the viewing window would be absolute positioning. Your code:

.footer{
position:absolute;
text-align:center;
background-image:url(images/bk_space.jpg);
bottom:10px;
width:710px;
left: 0px;
}

looks pretty good. From what I see it looks like the footer would rest at 10px from the bottom, all the way to the left of the screen with a width of 710px.

If you want it to be at the absolute bottom of the page try changing the bottom:10px to bottom:0px.

I have a bottom footer like this on my site. You can use that code if you like. It's at

http://www.stdominion.net.

Good luck with the footer.

 

[Vragabond]

I do believe the solution posted by user oppcos a while ago is still the only acceptable solution of having a footer at the bottom of the page. See the solution in these threads (look for that user name):

http://www.tek-tips.com/viewthread.cfm?qid=1015205

http://www.tek-tips.com/viewthread.cfm?qid=1016472

That should do it.

 

[dmacster]

I've had to use the following with x.js to get going

http://www.sitepoint.com/article/exploring-limits-css-layout/2

hope that helps