cancel
Showing results for 
Search instead for 
Did you mean: 

How to hide or disable vertical and horizontal scrollbars?

SOLVED
Highlighted
New User

How to hide or disable vertical and horizontal scrollbars?

I would like to hide or disable the vertical and horizontal scrollbars from the Firefox (20.0.1 at the moment) window, is there any CSS rule or setting in "about:config" resource to get this behaviour?

Thanks in advance.

1 ACCEPTED SOLUTION

Accepted Solutions
Site Moderator

Re: How to hide or disable vertical and horizontal scrollbars?

The above posted code should still be working.

Make sure that you have placed the userChrome.css file in the chrome folder in the Firefox profile folder.
This chrome folder doesn't exist by default and needs to be created.


@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

#content browser {
 margin-right: -14px !important;
 overflow-y: scroll;
 overflow-x: hidden;
}
6 REPLIES
Site Moderator

Re: How to hide or disable vertical and horizontal scrollbars?

You can hide scroll bars with an overflow:hidden rule, but if you would hide scroll bars then you may not be able to scroll the browser window anymore.

You can try code like this in userChrome.css and adjust the margin-right:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

#content browser{margin-right:-14px!important;overflow-y:scroll;overflow-x:hidden;}

Add code to the userChrome.css file below the default @namespace line.

The customization files userChrome.css (interface) and userContent.css (websites) are located in the chrome folder in the user profile folder.

New User

Re: How to hide or disable vertical and horizontal scrollbars?

It works great, gives exactly the results I was looking for! Thanks again!

Tested on Firefox v.20.0.1 running on ArchLinux x86_64 GNU/Linux.

CSS code written in '~/.mozilla/firefox/<alphanumeric-profile>/chrome/userChrome.css', don't forget to restart Firefox after editing/creating the files/folders.

2013-04-20-15-07-05-cc35b2.png
New User

Re: How to hide or disable vertical and horizontal scrollbars?

This solution does not work in v.23.0. I put this style in

~/.mozilla/firefox/eyrf55gp.default/

which I determined was the active profile based on its timestamp. The scrollbars are still there.

I am running gentoo, so can patch firefox easily. Is there a feature in the code that will allow me to dispose of scrollbars entirely? I never use them for scrolling. I wouldn't mind one scrollbar show in the active window as an indicator while it is scrolling (like in safari), but otherwise scrollbars are just a waste of space and a huge clutter factor.

Site Moderator

Re: How to hide or disable vertical and horizontal scrollbars?

The above posted code should still be working.

Make sure that you have placed the userChrome.css file in the chrome folder in the Firefox profile folder.
This chrome folder doesn't exist by default and needs to be created.


@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

#content browser {
 margin-right: -14px !important;
 overflow-y: scroll;
 overflow-x: hidden;
}
New User

Re: How to hide or disable vertical and horizontal scrollbars?

It works. Beautiful.

The scrollbars have not completely disappeared, but they are now squashed to four pixels wide (including the window border) and the indicator bar itself is just one pixel wide. Not exactly how I wanted it, but good enough.

The reason I was unable to get it to work following the instructions (including the above KB article) is that my profile folder is not .mozilla. I had to hunt it down and then create the chrome folder in it. Here's what my folder structure is (with a lot of stuff omitted):

.mozilla/
├── appreg
├── eclipse
├── extensions
├── firefox
│   ├── 5q0epjhm.default
│   ├── Crash Reports
│   ├── a459vpi6.default
│   ├── eyrf55gp.default
│   │   ├── Cache
│   │   ├── _CACHE_CLEAN_
│   │   ├── adblockplus
│   │   ├── addons.sqlite
│   │   ├── addons.sqlite-journal
│   │   ├── blocklist.xml
│   │   ├── bookmarkbackups
│   │   ├── cert8.db
│   │   ├── cert_override.txt
│   │   ├── chrome
│   │   │   └── userChrome.css
│   │   └── xpti.dat
│   ├── pluginreg.dat
│   └── profiles.ini
├── pluginreg.dat
└── plugins

The chrome folder was not there; I cerated it following cor-el's advice.

I could tell which of the hash-coded profiles was active by checking the access timestamps on them. Also, there is the profile.ini file containing a reference to it:

[General]
StartWithLastProfile=1

[Profile0]
Name=default
IsRelative=1
Path=eyrf55gp.default

I don't know why my profile layout does not match its description in the docs, but so it is.

Site Moderator

Re: How to hide or disable vertical and horizontal scrollbars?

This is the normal layout for the Firefox profiles.

You seem to have two other profile folders (5q0epjhm.default and a459vpi6.default), probably from older Firefox versions.
You can probably remove the pluginreg.dat files apart from the one in the current Firefox profile folder.

I don't know if the Cache folder in the current Firefox profile folder is still in use. Current Firefox versions have the cache folder in ~/.cache/mozilla/firefox (you can check the location on the about:cache page).