21

In my Firefox 81.0.1 64-bit, on Windows 10 Pro 64-bit, the scroll buttons in the Similar Questions list on the Ask Question page (and also in code blocks everywhere else) are invisible:

enter image description here

That scrollbar wouldn't go up any further. I wondered about this, and @JohnDvorak explained that the buttons are invisible, and that it was by design, which is confirmed here. This also happens with the question body when there is enough content to merit a scrollbar.

With due respect, it is a terrible design choice to make a button that is functioning and clickable invisible. Can we please revert this?


UPDATE

@TylerH's Stylus solution works very well. Codeblock scrollbars:

enter image description here

And the scrollbar-buttons in the question body:

enter image description here

@Ygoe's solution (it too is Stylus) should also be noted. Both do the job, and are very simple fixes. Thanks Tyler, Ygoe!

7
  • 3
    I provided some background for what is happening here. It absolutely was not our design choice to have blank space where the arrows should be. It is a side-effect of attempting to color the scrollbar. If anything, it was Firefox's design choice. – animuson Sep 20 '20 at 15:52
  • 9
    @animuson How is it the vendor's fault that you are using styles which cause this problem? I'm not buying that... just don't use non-standard properties and the problem goes away. – TylerH Sep 20 '20 at 19:41
  • 4
    @TylerH First off, it is a standard property that is part of a CSS working draft, and second the standard gives the vendor control over what happens when the color is changed. Which honestly makes it not very standard in my opinion. As I said in the other question, I hate when websites customize the scrollbar. I believe the browser should be the sole controller over what the scrollbar looks like and the website should not be messing with it. I hope when this property is more worked out that browsers will have the option to disable it across all sites, but that's just me. – animuson Sep 20 '20 at 19:53
  • @animuson I thought it was the -moz-scrollbar-color style that was causing the issue. Maybe I'm remembering the vendor-specific styles that apply to Chrome instead. – TylerH Sep 20 '20 at 22:02
  • 5
    But how about SE not messing around with the scrollbar, @animuson? That would fix things right? – Luuklag Sep 21 '20 at 5:38
  • 3
    @Luuklag It would, and I'm all for it. But it's not my decision. – animuson Sep 21 '20 at 16:03
  • 5
    @animuson any chance to make this status-review and have the design team have a look at it? – Luuklag Sep 21 '20 at 18:28
2

As a stopgap measure, per Ollie's request, I'm posting a Stylus user style here to fix this, at least for Firefox:

/* reverts scrollbar to normal browser behavior */
pre:not(.CodeMirror-line) {
    scrollbar-color: var(--scrollbar) !important;
}

In Stylus, make sure this applies to "URls on the domain" of the following values:

  • stackoverflow.com
  • stackexchange.com
  • superuser.com
  • mathoverflow.net
  • serverfault.com

to hit all the various SE sites that are on their own domains.

6
  • @Ollie No it does not. What version of Firefox are you using? – TylerH Sep 24 '20 at 19:35
  • @Ollie Are you on Windows or macOS? I'm on 80.0.1 on Firefox, but nothing related to this changed in 81. Try also adding a style like * { color: red !important; } to the user style document that applies to the pages to make sure it is taking place. That would turn all text red. If it doesn't turn everything red then you have something else conflicting, don't have live preview turned on/haven't saved it correctly/enabled it correctly, or don't have the right URL settings. – TylerH Sep 24 '20 at 20:35
  • @Ollie Remove the @ query. The add-on and styles are per-browser already. Here is what my styles look like (some additional styles currently lumped into that selector for other changes) and what domains they apply to below (the "what domain this applies to" below each code block applies to the code block above it). If you don't get the option to apply the "URLs on the domain" option you may need to uninstall and reinstall the add-on. FWIW I am on version 1.5.13 of Stylus (Aug 10, 2020). – TylerH Oct 5 '20 at 14:48
  • @Ollie Not sure, as I don't think I've seen that on the site before. Do you have an example question that has a scrollbar inside it that isn't for a code block I can test on? – TylerH Oct 8 '20 at 13:21
  • 1
    Yahoo! Got it! Thanks for all your help, Tyler, it looks way better now ;) – Ollie Oct 10 '20 at 18:38
  • 1
    Accepting this answer for now to give it more visibility. SE doesn't look like it'll get to this any time soon, but for now, this is great. – Ollie Jan 6 at 17:59

You must log in to answer this question.

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