I'm doing a project right now where we're going to develope a website. I'm responsible for the design/CSS.


This is what I've done so far, but there seems to be some bugs. Whenever I zoom out, the footer wont be sticked at the bottom of site and the content box wont be in the middle. It just moves to the left. A friend told me that the website also movies horizontal, but I can't see that. What have I done wrong? How can I fix this?

This is just a beta version, I will change the colours etc. I just things to be right first :P

6 Years
Discussion Span
Last Post by Dandello

Well, for one, #content isn't even in the center - it has a left position of 14% and margin: 0 0 20px.

Try setting the margin to margin: 0 auto 20px auto; and drop the left:14%.

Things that should stick to the bottom don't always, especially if the content gets to a size where there are vertical scroll-bars. In this case, white shows beneath the footer when the viewing window is bigger about 800px high and doesn't when the window is smaller than that.

To overcome that, the only solution I've come across is to use javascript to detect whether or not there's a vertical scroll bar and adjust the position of the footer in response to that. OR, you can fix the footer to the bottom using position:fixed, but then it will move when you scroll up and down. (Like the one at the bottom of this screen here.)

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.