Footer - CSS/HTML

Associate
Joined
7 Mar 2007
Posts
1,244
I need help creating a footer.

This is my CSS code:
Code:
#footer{
padding:0px;
margin:0px;
background-color:#202126;
color:#fff;
border-bottom: 1px solid #dbd4d4;
border-top: 1px solid #dbd4d4;
text-align:center;
}

This is my HTML code:
Code:
<div id="footer">
<font size=-2>&copy;2007 tchan_4</font>
</div></center>

The problem is, the footer is appearing at the top of the page and not at the bottom, how do you fix this?

Thanks
 
You can fix the footer to the bottom of the page by adding:

bottom:0px;
position:fixed;
to the #footer style.

That might not be for your tastes however as it literally fixes itself to the bottom and doesn't stay at the bottom of the page itself and rather fixes to the bottom of the browser window.
 
Last edited:
It's hard to suggest what to do if we can't see the rest of your HTML and CSS.

What works for one layout may not work for another.
 
You have used absolute positioning for your columns, which means they have been taken out of the normal document flow. The footer is the only element left [as far as the browser is concerned] in the flow so it goes to the top.

You will need to absolutely position the footer or use floats for your columns.
 
Back
Top Bottom