1

I want to widen the scrollbar on Firefox but the answer I found doesn't give full enough instructions for me. How to remove overlay-scrollbars in Ubuntu 17.10 and 18.04? It says "Put this into your ~/.config/gtk-3.0/gtk.css (create the file, if necessary):" What do I do? Where is it found? Do I type the info on Notepad and put the .txt document somewhere? Do I use a .css program? I know nothing about CSS, never even heard of it so I'm completely stumped. Can you give me NEWBIE step by step instructions to accomplish this?

user437092
  • 11

2 Answers2

2

Freedom of choice (which I really like) under Linux makes this unfortunately quiet complex.

There are mainly two (or three depends on the view) theme engines around, which each has its own config files and additionally they change the config "engine" during their history.

  • GTK/GTK+ Versions 2, 3, 4
  • QT Version 4, 5, 6

Depending on your Linux distro and desktop (Gnome, KDE) it might be possible to have a firefox installed which uses GTK or QT. But personally I have never seen a firefox using QT theme engine, lets concentrate on GTK. Newer Ubuntu use GTK+ Version 3. I am nearly sure your firefox uses this, too. You might see this by looking in /usr/lib/firefox (assuming not using firefox from snap).

GTK+ v3 uses themes from /usr/share/themes/. The easiest is to make a link from a subdirectory of a themes folder named gtk-3.0 to your `~/.config/gtk-3.0´ directory. This will nearly immediately change the layout of nearly everything on your screen.

Besides this, it is possible to configure this via dbus. Ether directly with the dconf-editor or some tools like gnome-tweaks (I assume there are some others, (LXappearance?)).

Do not believe freedom ends here ...

Inside firefox there are some configurations possible, too. Use the url about:config and if you believe you can handle the power, you can enter the deep config of firefox. Search for "scrollbar" and play with the settings. If you are not sure about the power in your hands, play in a different firefox profile (firefox -P).

I assume the docu in your link is not valid anymore in Ubuntu 20 or 22.

Most probably this is not the end, but I stop here in hope you are now motivated to modify your theme or even create a whole new theme.

Update:

I just did some tests with Ubuntu 20.04 and Firefox from Ubuntu package in the standard Ubuntu Gnome environment.

In this environment you can change the size of the scrollbar in Firefox in about:config in the parameter widget.non-native-theme.scrollbar.size.override

change scrollbar size

I can not tell, if this works in a different configuration. This is just a "guess" of your config, because this is the most common on Ubuntu.

Marco
  • 1,188
  • I can't directly solve it, because there are many details missing. Of course I could just "guess" how his installation looks like, but would a guess be better ? – Marco May 07 '22 at 14:46
  • @mook765 feel free to write your answer. If it solves it, I will delete mine. – Marco May 07 '22 at 14:48
  • I can confirm, this works on 22.04 with palsma desktop. I have the deb installed, not the snap. But since this is a firefox setting, I'd assume this works also in snap version. – mook765 May 07 '22 at 15:28
  • I went into about:config and changed the value for widget.non-native-theme.scrollbar.size.override to 100 but it didn't change the width of my scrollbar. Thanks very much for getting back to me and for your help. – user437092 May 07 '22 at 16:10
2

Ubuntu's default scrollbars are so paltry it's no wonder they hide when you're not directly over them. :-D

Joking aside, I found these settings to help improve the user experience of Firefox at least:

  1. Open about:config by typing it into the URL bar.
  2. Search for the following settings and set them to the values given:

Make the scrollbars not shrink when the mouse isn't over them:

  • widget.gtk.overlay-scrollbars.enabled = false

Change the scrollbar width to something wider:

  • widget.non-native-theme.scrollbar.style = 4 (you may want to play around with this one. 1 is also a better-looking default.

Further fix to prevent sites from setting scrollbar width via CSS:

  • layout.css.scrollbar-width-thin.disabled = true
amphetamachine
  • 135
  • 6