7

The new responsive look is great, but there's a problem with always displaying the right sidebar. For narrower browsers, it causes the main content to become too squished.

To fix this problem, we need a way to collapse the right sidebar or display it in some completely different way.

The attached images show this effect.

Enter image description here

Enter image description here

Improve this question
4
  • I think if you shrink your browser enough, the right sidebar should get pushed down to the bottom of the page and allow the main content to expand. Does that work for your browser? Or do you mean that it should be bumped down even at larger widths than it does currently?
    – Em C
    Commented Nov 17, 2018 at 1:51
  • 5
    Ah, I didn't notice that it jumps down with only a slightly narrower browser width. Well, in my opinion, the threshold should be a lot wider. Wide enough to ensure the main content is at least, say, 700 px wide.
    – Peri Hartman
    Commented Nov 17, 2018 at 1:55
  • I am having this issue as well on my browser, which already takes up half the screen. Currently I just disable responsiveness which works like a breeze, but that option might not be around forever.
    – forest distrusts StackExchange
    Commented Nov 17, 2018 at 2:30
  • 1
    It should be togglable, like the left sidebar is, not pushed to the bottom. (That's a prescriptive "should", not a predictive one. The current design is pretty terrible for windows in the 900-1100px range.)
    – Monica Cellio
    Commented Nov 18, 2018 at 1:15

1 Answer 1

Reset to default
7

The standard "break" here is aimed at keeping the sidebar(s) visible as long as possible without making the content unusable. That works pretty well for most standard screen sizes, but if you (like me) prefer to tile your windows... It can be annoying.

So, here's a userscript that demonstrates how to adjust that break. Tested in Chrome with Tampermonkey - may need some adjustment elsewhere. Alternately, use something like Stylus to just jam the relevant style in without messing around with userscripts.

The critical value there is 1160px - that's changed from the default value of 980px, effectively increasing the minimum content width by 180 pixels. Adjust up or down to suit your tastes!

Related: Ch-ch-ch-changes: Left nav, responsive design, & themes

Improve this answer
5
  • 1
    What would it take to make it togglable? I sometimes want to see some of that info (like the question stats on question pages), but I don't need to waste vast amounts of real estate all the time -- I'd like to be able to ask for it when I want it and get it out of the way otherwise.
    – Monica Cellio
    Commented Nov 18, 2018 at 1:19
  • What would it take? Not much. But... I'm not convinced that's a big improvement either; there's a LOT more in the right sidebar than in the left, and I don't think it lends itself as readily to the same pop-out behavior. Which parts do you use, and in what scenarios?
    – Shog9
    Commented Nov 18, 2018 at 5:02
  • On question pages, I use the asked/viewed/active stats for a quick summary and sometimes to jump to the latest activity. (Views is the most important stat there.) When a question sounds familiar I use the "related" section to look for possible dupes. On the front page, I look at the community bulletin (the yellow box). All the other stuff in that column is of much lower value to me. (I think the "professional service" disclaimers that a few sites have are critically important for newcomers, but experienced users don't need them as much.)
    – Monica Cellio
    Commented Nov 18, 2018 at 5:16
  • 2
    I agree with Monica: hide the right side bar when you're focusing on the main content. If you want the right side bar, just pop it out for a moment. In other words, when you're done navigating, you'll be focusing on some particular "question." At that point, you're done with the sidebar, so why have it taking up valuable space?
    – Peri Hartman
    Commented Nov 18, 2018 at 7:07
  • Your script didn't work out of the box for me, but after I removed the not parts surrounding .html__unpinned-leftnav (actually simply copy-pasted corresponding max-width:816px-related part of primary-unified.css), it did start to work.
    – Ruslan
    Commented Dec 30, 2018 at 15:15

You must log in to answer this question.

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