Hiding scrollbars on Firefox Quantum

UPDATE: updated at June/2018, now works with recent Firefox versions.

The new Firefox (also know as Firefox Quantum) is so good and so fast that I’ve happily living with it even with the loss of my essential tab-management add-ons. It’s that awesome.

What’s less awesome is that there’s no way to hide the scrollbars, and no extension that can actually do it. And it won’t ever be – those kind of changes to the user interface are just no longer possible.

Fortunately, you can still nuke’em out of existence by editing your userChrome.css . Here’s how.

Find your Firefox profile folder

If you’re a long-time Firefoxer, you likely know where it is. If you don’t:

  1. Open Firefox
  2. Access about:support (or click on Menu > Help > Troubleshooting Information)
  3. See the “Profile Folder” there, under “Application Basics”? You can open that path on Explorer/Finder/GFiles, or just click on ‘Open Folder’.

Read more about profile folders here if you’re so inclined.

Create your userChrome.css

Now that you’re in the profile folder, create a new folder named “chrome” .
Just chrome,  lowercase.Inside that folder, create a new file named “userChrome.css“, with the following content:

#content browser, .browserStack>browser {

Let’s check: this file should be at [wherever your profile folder is]/chrome/userChrome.css .

Save it, and restart Firefox. You’re done! The scrollbars are gone.


But now I can’t see how long the pages are =(

You may change the two occurrences of -17px to -14px; this will leave a tiny, three-pixel wide scrollbar that isn’t that disturbing and still allows you to have an idea of where you are in a document.

Will this sync over to my other Firefoxes using Sync?

Nope. You’ll have to do this by hand on all your Firefox installations.

What have I done?? How do I undo this??

Just delete the userChrome.css and restart Firefox. 

Oh, I can just use the [insert extension name here]!

No, you can’t. Seriously, go try it: you really really can’t. There’s a lot of extensions for that, but none of them work with the new Firefox.
And they won’t ever will unless Mozilla changes the API, which is unlikely. Like I said, the new API simply does not allow changes to interface elements like that.

Are there other ways?

Take a look there.

Hey! This hides part of the content too!

Yes, it does. This is unavoidable, since the way this works is by hiding the last few pixels at the corners of the content. Usually you won’t even notice it; but it can be an issue with certain page designs. For other solutions that doesn’t share this caveat, see above.

— Matheus E. Muller