Footer glitch when browser window is not wide enough

by Brian   Last Updated June 13, 2019 08:24 AM

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.



Answers 2


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.

uɐɯsO uɐɥʇɐN
uɐɯsO uɐɥʇɐN
September 29, 2010 21:29 PM

I suggest the following solution instead of George's:

#footer {
/* Current styles */
min-width:960px;
}

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

waiwai933
waiwai933
September 29, 2010 23:46 PM

Related Questions


Updated August 04, 2017 14:24 PM

Updated May 26, 2019 20:24 PM

Updated July 14, 2015 14:10 PM

Updated September 25, 2017 17:24 PM