1

Here (on Chrome 10) the footer seems to be aligning with the side bar (too far to the right) instead of center like it's supposed to be.

I didn't edit the footer's CSS. I was editing the sidebar and the index when this happened, but it's so far down the page that I didn't notice 'til later, so I have no idea what the problem is.

Any suggestions welcome! Thank you :)

Tara

UPDATE: I've checked all the DIVs are correctly closing. Some were missing in the side bar, and that's fixed the problem on the front page but not on sub pages or articles. Now there is a black line appearing at the top (under the menu) that appears to be the #footer!!. I can't understand why it's there.

enter image description here

Tara
  • 1,528
  • 4
  • 20
  • 28
  • its not a css problem, your footer container is inside your right column. I recommend to set it at the bottom of your #wrapper and validate your html, there are some missing divs – Rito May 09 '11 at 10:21
  • Thanks @Rito I tried this and it fixed the home page but not the other pages for some reason :( Still working on it... – Tara May 09 '11 at 12:30
  • The footer is working now! @Rito was right I was missing a div. Unfortunately, the side borders of the content are now missing.... – Tara May 09 '11 at 12:39

2 Answers2

1

You need to clear your floated elements by adding clear: left; to your #footer css.

Dave Kiss
  • 10,289
  • 11
  • 53
  • 75
  • Thanks @Dave, I'll try this though it seems to be fixed now so I won't be able to tell if it makes a difference - but the footer does tend to move for no apparent reason from time to time so hopefully this should help =) – Tara May 09 '11 at 13:20
1

you wrapper #casing contains floated elements, which are not cleared for following elements.

#casing { overflow: hidden; }

This should fix it for modern browsers. I recommend this article for better understanding and other clearing solutions.

Community
  • 1
  • 1
Rito
  • 5,117
  • 3
  • 40
  • 37