I thought I got it, but it only works if the page is full of content...

how would I get my footer bar to sit at the bottom of the browser?
I have tried adding vertical-align:bottom; to my css and tried margin: 0 auto;


website: http://uuilliam.net/test_server/comment.php

This site might help you: http://ryanfait.com/sticky-footer/

So basically wrap your content inside a div and give it a min-height.

not working

You can't just give a div a wrapper class and not have any CSS rules applied to it. Put the min-height property inside the stylesheet and assign it a value of however much you want.

Also make sure the footer is outside of the content wrapper.

Also, the height needs to be applied to all wrapping elements in this instance. So just make sure your CSS has this:

html, body {
 height: 100%;
}

.wrapper {
 min-height: 100%;
}

http://www.webmaster-talk.com/css-fo...gn-bottom.html

http://www.themaninblue.com/writing/...ve/2005/08/29/

that helped me (well.. you guys helped me, then through chris' link I got that link.)

all I added was:

html{
height:100%;
}
.wrapper{
min-height:100%;
height !important;
}
body{
height:100%;
}

Problem #2, When on http://uuilliam.net/test_server/comment.php

if you expand the chat,

it continues under the footer :S, it isn't floated so I know floats aren't the problem...
and surely the thing to push the footer down should have stopped that from happening?

Probably absolute positioning, but as the entire page is a grey box for me, I can't tell what is what any way.

I'd suggest that you pay some serious attention to accessibility before you go much further.

made background white so you can see it.

Seems to work ok in FireFox what browser(s) is the problem with?

expand the comment box (the first little box says view all 16 comments) click that
then thats when it over laps.

bump.

browser?

I am using chrome, firefox, opera, safari and ie, happens in them all

Float the content container then clear the footer div.

I added float:left; to .wrapper
and added
clear:both; to .footer

problem is; it pushes content to left
and still over flows the footer

the only thing that it does fix, is the background of the content also displays above the footer.

update:

adding the float to the disclaimer
then adding <div class="clear" /> to footer and in css put .clear {clear:both;}

but the "comment" button still appears above it so I am guessing it is probably floated in the other style sheet

but I also want 50px of space between bottom of content and the footer, but when I add a margin-top to footer, it pushes it down instead of just forcing the content to stay 50px away (if you get what I mean)

i also tried margin-bottom on the content container but same thing happens.