Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

userChrome.css not working

  • 3 replies
  • 0 have this problem
  • 584 views
  • Last reply by James

more options

System Info: 1. Windows 10 Home 22H2 (as of writing) 2. Firefox 118.0.2 (as of writing)

I'm trying to make the simple change of moving the location of the 'find in page' bar from the bottom to the top and I recently discovered that using userChrome.css was the way to do it. I followed this tutorial in the following link, https://www.userchrome.org/how-create-userchrome-css.html, making sure to put the "chrome" folder in the right location C:\Users\myName\AppData\Roaming\Mozilla\Firefox\Profiles\sfytm5xk.default-release, switching the toolkit.legacyUserProfileCustomizations.stylesheets to true, entering the code snippet into the userChrome.css using VSCode, and restarting the browser for the changes to take effect.

After the first restart, I found that the 'find in page' bar was still at the bottom and nothing had changed. I restarted the browser about 10 more times and nothing changed still. I looked through the Mozilla Support forums, r/FirefoxCSS and r/Firefox subreddits for an answer and came across a few posts with similar problems, tried their recommended solutions such as downloading the userChrome.css file from the website tutorial, double-checking that File Explorer would show file extensions when creating or renaming files, or even restarting my computer and yet none have worked.

I have no idea what's wrong so feel free to share what you think the problem might be and possible solutions in the replies.

System Info: 1. Windows 10 Home 22H2 (as of writing) 2. Firefox 118.0.2 (as of writing) I'm trying to make the simple change of moving the location of the 'find in page' bar from the bottom to the top and I recently discovered that using '''userChrome.css''' was the way to do it. I followed this tutorial in the following link, https://www.userchrome.org/how-create-userchrome-css.html, making sure to put the "chrome" folder in the right location '''C:\Users\myName\AppData\Roaming\Mozilla\Firefox\Profiles\sfytm5xk.default-release''', switching the '''toolkit.legacyUserProfileCustomizations.stylesheets''' to '''true''', entering the code snippet into the '''userChrome.css''' using VSCode, and restarting the browser for the changes to take effect. After the first restart, I found that the 'find in page' bar was still at the bottom and nothing had changed. I restarted the browser about 10 more times and nothing changed still. I looked through the Mozilla Support forums, r/FirefoxCSS and r/Firefox subreddits for an answer and came across a few posts with similar problems, tried their recommended solutions such as downloading the '''userChrome.css''' file from the website tutorial, double-checking that File Explorer would show file extensions when creating or renaming files, or even restarting my computer and yet none have worked. I have no idea what's wrong so feel free to share what you think the problem might be and possible solutions in the replies.
Attached screenshots

Modified by simonaghedo

Chosen solution

-moz-box-ordinal-group is no longer supported in 113, use order with a value one less:

Possible CSS code to try:

/* Find Bar on top of page */
.browserContainer > findbar {
 order:-1 !important; /*113*/
 border-top: none !important;
 border-bottom: 1px solid ThreeDShadow !important;
}

Read this answer in context 👍 2

All Replies (3)

more options

Chosen Solution

-moz-box-ordinal-group is no longer supported in 113, use order with a value one less:

Possible CSS code to try:

/* Find Bar on top of page */
.browserContainer > findbar {
 order:-1 !important; /*113*/
 border-top: none !important;
 border-bottom: 1px solid ThreeDShadow !important;
}

more options

Appreciate the tip, cor-el! Your code snippet worked beautifully! :D

more options

Dropa said

You need to contact the css maker about the issue with their userChrome.css edits.

As I said to you dozens of times now, people are still welcome to try and get help with userChrome.css and userContent.css here. Besides it is quite possible thy got it from here originally.

And as you can see above, cor-el was able to help the OP.

Modified by James