2 replies to this topic

[Tratos]

I have a problem positioning something with css. I want it to stick to the bottom of the page, so that when the content overflows the browser view it sits at the bottom of the page but when the content is smaller than the browser view it sits at the bottom of the browser view.

I've tried enclosing everything in a table that is 100% and then putting this table under that but that didn't work when the content was small because it made the page huge and you could scroll through a large white space to get to the bottom.

I've tried using css to position it but im having no luck, im using;

position: absolute;
left 0px;
bottom: 0px;

to align it right at the bottom of the page, however this aligns it to the bottom of the viewport, i've tried;

position: absolute;
left 0px;
top: 100%;

but that makes the top edge position just outside the viewport.

I've even tried;

position: absolute;
left 0px;
bottom: -100%;

which aligns it to where it should be but stretchs the page out.

Im completly stuck on this now and would appreciate some help.

Edit: i don't know why i posted this in php , can someone move it please.

Edited by Tratos, 15 August 2006 - 10:05 PM.

[Hostile]

I'd assume you're using div elements to place things, if that is the case use this.

clear: both;

in the style sheet. This means the element has to clear everything to the left and to the right before showing up. See if that helps any.

[Kravvitz]

This technique is a bit complicated, but it works well: How do you put a footer at the bottom of the window?