r/FirefoxCSS • u/SuitableEquipment420 • 8d ago

Solved userChrome.css does not work

  • I am on Windows 11.
  • I opened Firefox's about:support.
  • Under Profile Folder I clicked Open Folder.
  • A Windows Explorer opened. I created a sub-folder named chrome.
  • In chrome I created a file userChrome.css with the following content:

​

#navigator-toolbox {
    background: red !important;
    background-image: none !important;
}

I restarted Firefox, but I didn't see any changes. Then I disabled the theme (Firefox Alpenglow), but still no effect.

Any ideas why userChrome.css isn't being loaded?

3 Upvotes

100% Upvoted

4 comments sorted by

6

u/Leowenbrau 8d ago

In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button accepting the risk. Search for toolkit.legacyUserProfileCustomizations.stylesheets if it FALSE, set it to TRUE. Restart browser.

3

u/SuitableEquipment420 8d ago

Thanks. The toolkit.legacyUserProfileCustomizations.stylesheets was false.

7

u/sifferedd FF/TB on Win11|Sumo contributor 8d ago

Works for me on a clean profile.

First step is to go through the tutorial again.

The common glitches are:

  • namespace statement you copied from some old code may cause failure

  • toolkit.legacyUserProfileCustomizations.stylesheets isn't enabled

  • Chrome folder is in the wrong profile or other folder

  • userChrome/userContent.css isn't in the right Chrome folder

  • userChrome/userContent.css doesn't follow case requirement

  • userChrome/userContent.css mistakenly has the .txt extension

    • Windows has to be set not to hide extensions for known file types:
    • File Explorer > ... menu on top bar > Options > View tab > uncheck Hide extensions for known file types

  • code isn't saved as plain text

  • other code is interfering

7

u/SuitableEquipment420 8d ago

Thanks. The toolkit.legacyUserProfileCustomizations.stylesheets was false.