My forum footer doesn't stick to the bottom of the page - I need help!

[Amazing]

As you can see, the footer isn't at the bottom of the page sometimes and I'm not sure why.

The following is my footer CSS:

#foot {
	width: 100%;
        margin: 0 auto;
        position: relative;
        bottom: 0;
        height: 250px;
        background: url(images/v2/footerbg.png);
        border-top: 1px solid #000;
        color: #fff;
}

You can view my site here (if you have firebug and need to view code): http://sportsbb.net/

[J. H. Rasmussen]

The easiest way would probably be to set a minimum height of the content in the middle of the page, moving the footer down.

Something like:
#content{
min-height: 400px;
}

[Amazing]

Okay, so I should set a minimum height on my container? That's where the middle content is:

#container {
	width: 95%;
	color: #000000;
	margin: auto auto;
	padding: 20px;
	text-align: left; /* IE 5 fix */
        clear: both;
}

Edit ----- Awesome, I got it, thanks so much!

[webcosmo]

you have to have the container height 100% leaving a bottom margin equal to the footer height.
here is a nice piece of code http://ryanfait.com/resources/footer...ottom-of-page/

[JohnnyS]

Originally Posted by Amazing

As you can see, the footer isn't at the bottom of the page sometimes and I'm not sure why.

The following is my footer CSS:

#foot {
	width: 100%;
        margin: 0 auto;
        position: relative;
        bottom: 0;
        height: 250px;
        background: url(images/v2/footerbg.png);
        border-top: 1px solid #000;
        color: #fff;
}

You can view my site here (if you have firebug and need to view code): http://sportsbb.net/

it is because the content of your page does not take up all of the height of the browser, what you can to is put a height 100% on your html and body tags..

html,body { height:100%; position:relative; }