Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 158 Stack Exchange communities.

What is meta?
Here's how it works:
  1. Any Stack Exchange user can ask a question
  2. The community provides support, votes on ideas, and reports bugs
  3. Your voice helps shape the way Stack Exchange operates

See image for example. This happens in IE8 and Opera 10.62 (I didn't test other browsers). Basically, if your browser window is not wide enough, the footer is a bit broken when you scroll.

share|improve this question
Reproduced in Chrome 6.0.472 – jjnguy Sep 29 '10 at 21:16
Reproduced in Opera 10.62 build 6438 on Ubuntu 10.04 64-bit. – uɐɯsO uɐɥʇɐN Sep 29 '10 at 21:17
After playing around with the CSS files... I still can't determine why that's happening. Time to fire up jsFiddle, I guess. – uɐɯsO uɐɥʇɐN Sep 29 '10 at 21:21
I found the problem! – uɐɯsO uɐɥʇɐN Sep 29 '10 at 21:29
Repro in FF 3.6.10 as well. Nice find. – Jon Seigel Sep 30 '10 at 1:35
Am I missing something? Nothing seems to have changed. – Brian Feb 10 '11 at 23:00
up vote 6 down vote accepted

I suggest the following solution instead of George's:

#footer {
/* Current styles */

This preserves the current behavior of the footer stretching page wide while still fixing the bug.

share|improve this answer
Good job. Although I intended for the footer to just be centered, this looks much nicer. – uɐɯsO uɐɥʇɐN Sep 30 '10 at 0:02
+1: Not only does this look nicer, it also properly matches the existing behavior when the window is expanded. Very easy to implement, too. – Brian Sep 30 '10 at 13:13
Removed acceptance and added bounty in hopes of attracting admin attention. – Brian Feb 4 '11 at 22:13

I have found the problem and the solution.

The problem:

<div id="footer">
    <div class="footerwrap">

The solution:

<div id="footer" style="width: 960px;">
    <div class="footerwrap">

Notice the addition of style="width: 960px;".

This forces the bottom bar to be the same width as the rest of the page.

Update: It is also necessary to include:

margin-left: auto; margin-right: auto;

in the style parameter. This centers the bar along the bottom.

share|improve this answer
This breaks the footer (a different way) once you make your browser window wide again. – waiwai933 Sep 29 '10 at 22:41
@wai: No it doesn't. Read my update at the bottom. – uɐɯsO uɐɥʇɐN Sep 29 '10 at 22:43
Right, it centers the footer, but the background doesn't extend all the way to the left and right. – waiwai933 Sep 29 '10 at 22:57
@wai: That's not a glitch - I intended that to happen. – uɐɯsO uɐɥʇɐN Sep 29 '10 at 23:09

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .