34

Update

A month Several months later, a new top bar, and the bug still exists. An answer has already been posted that would fix the bug, so is this something that the dev team plans on fixing?

There are also a host of other problems caused by this, especially on the footer and CC-logo. Again, this would be fixed with

html{min-width:1000px;}

There is a slight bug with small windows on both the new meta and main site(s)?, shown here. The problem is that the top bar coloring doesn't stretch across when you resize and scroll left or right.

On Meta, when a horizontal scroll bar is needed, the black background will only be as wide as the width of the viewport, but when you scroll the coloring will not shift.

To reproduce:

  1. Make screen as large as possible, or wait until the menu bar starts expanding
  2. Make it smaller and smaller until horizontal scrollbar appears, then scroll left and right.
9
  • 1
    I see red outlines, but I don't see what they're referring to. Can you expand? Also use some text description too so that if people also want to report the same thing then when they search to see if it's been reported before it'll come up in the search results. Pictures don't.
    – JonW
    Nov 20, 2013 at 14:21
  • @JonW it has to do with the coloring of the bar not stretching across the entire screen
    – scrblnrd3
    Nov 20, 2013 at 14:23
  • 4
    Oh... I see it too. Nice find! @JonW make your browser window width small and then scroll right.
    – gitsitgo
    Nov 20, 2013 at 14:26
  • How small? What browser? I wasn't able to reproduce with 1024x768 in Chrome 31 and IE10. When reporting design/CSS bugs please always include browser details. Nov 20, 2013 at 14:27
  • @ShaWizDowArd Resize until you need a scrollbar, then scroll to the right.
    – Stijn
    Nov 20, 2013 at 14:28
  • @Stijn I see, this should be in the post itself. (now it is) Nov 20, 2013 at 14:29
  • @ShaWizDowArd Reproduced in safari as well
    – scrblnrd3
    Nov 20, 2013 at 14:29
  • @helloworld yeah, this one appears to be "pure CSS" bug, meaning cross browser. Nov 20, 2013 at 14:32
  • This seems to be basically a duplicate of All Stack Exchange sites in a small window causing display problems?. However, since that question is kind of old and stale, I've voted to close it as a duplicate of this one instead. Anyway, the fix I included in SOUP for that bug fixes this one too. Jan 18, 2014 at 17:14

1 Answer 1

16

There is a very, very easy solution to fixing this and any other background problems that might exist on the site:

html { min-width: 1000px }

This would make the HTML root element 20px larger than the standard 980px site width, so that even on small screens all elements of the site will expand and encompass the full width of the site.

3
  • 1
    +1 - Confirmed that this works for the entire width of the bar. Very light weight as well.
    – Travis J
    Nov 20, 2013 at 17:02
  • 11
    Trying to get hired? ;) Nov 20, 2013 at 20:20
  • 4
    This will go live in the next build.
    – Adam Lear StaffMod
    Mar 19, 2014 at 17:56

You must log in to answer this question.

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