X
Tap here to go to the mobile version of the site.

Support Forum

I changed toolkit.legacyUserProfileCustomizations.stylesheets=true and ff still does not read userChrome.css. It is working on a laptop.

DG
Posted

The laptop is running V 69.0.2 and somehow, the desktop got on the beta channel (which I have since changed) and is running V 70.0b12. I copied the working userChrome.css file from the laptop to PC, but it just isn't getting read. Anything else that needs to be changed? I hate tabs on top!

The laptop is running V 69.0.2 and somehow, the desktop got on the beta channel (which I have since changed) and is running V 70.0b12. I copied the working userChrome.css file from the laptop to PC, but it just isn't getting read. Anything else that needs to be changed? I hate tabs on top!

Chosen solution

Thank you so much for your quick response! I did try your test

  1. nav-bar {
 border: 4px dashed red !important;

}

with no results.

I followed the instructions in the checklist and found my profile. As it turns out, I had put the chrome folder and userChrome.css in the following where I used AppData\LOCAL instead of AppData|ROAMING. Once I created the folder and userChrome.css file in the right location, it works.

C:\Users\xxxx\AppData\Local\Mozilla\Firefox\Profiles\0c8xxxxx.default
C:\Users\xxxx\AppData\Roaming\Mozilla\Firefox\Profiles\0c8xxxxx.default

Again, I thank you.

Read this answer in context 0
Quote
jscher2000
  • Top 10 Contributor
8793 solutions 71933 answers

Hi DG, do any rules in your userChrome.css file work? You could try a very unsubtle rule at the top of the file that puts a heavy dashed red rectangle around the main toolbar as a test:

#nav-bar {
  border: 4px dashed red !important;
}

If that doesn't do anything, you should double-check the names, capitalization, and location of your chrome folder and userChrome.css file. You can use this article as a checklist: https://www.userchrome.org/how-create-userchrome-css.html

Hi DG, do any rules in your userChrome.css file work? You could try a very unsubtle rule at the top of the file that puts a heavy dashed red rectangle around the main toolbar as a test: <pre>#nav-bar { border: 4px dashed red !important; } </pre> If that doesn't do anything, you should double-check the names, capitalization, and location of your chrome folder and userChrome.css file. You can use this article as a checklist: https://www.userchrome.org/how-create-userchrome-css.html
Was this helpful to you?
Quote

Chosen Solution

Thank you so much for your quick response! I did try your test

  1. nav-bar {
 border: 4px dashed red !important;

}

with no results.

I followed the instructions in the checklist and found my profile. As it turns out, I had put the chrome folder and userChrome.css in the following where I used AppData\LOCAL instead of AppData|ROAMING. Once I created the folder and userChrome.css file in the right location, it works.

C:\Users\xxxx\AppData\Local\Mozilla\Firefox\Profiles\0c8xxxxx.default
C:\Users\xxxx\AppData\Roaming\Mozilla\Firefox\Profiles\0c8xxxxx.default

Again, I thank you.

Thank you so much for your quick response! I did try your test #nav-bar { border: 4px dashed red !important; } with no results. I followed the instructions in the checklist and found my profile. As it turns out, I had put the chrome folder and userChrome.css in the following where I used AppData\LOCAL instead of AppData|ROAMING. Once I created the folder and userChrome.css file in the right location, it works. C:\Users\xxxx\AppData\Local\Mozilla\Firefox\Profiles\0c8xxxxx.default C:\Users\xxxx\AppData\Roaming\Mozilla\Firefox\Profiles\0c8xxxxx.default Again, I thank you.
Was this helpful to you?
Quote
jcurran516 0 solutions 4 answers

I've done this fix many times but it's not working this time. In my profile C:\Users\Main Office\AppData\Roaming\Mozilla\Firefox\Profiles\4moeoqoy.default-XXXXXXXXXXX818 I have a folder named chrome (lower case) and in that I have the file userChrome.css with the updated code pasted in from @namespace to #TabsToolbar .titlebar-buttonbox-container {display: none !important;}

Still getting nothing. I haven't done any programming since Fortran and Cobol were hot... Yup, I'm that old but not terribly incompetent. Any idea what I'm missing?

I've done this fix many times but it's not working this time. In my profile C:\Users\Main Office\AppData\Roaming\Mozilla\Firefox\Profiles\4moeoqoy.default-XXXXXXXXXXX818 I have a folder named chrome (lower case) and in that I have the file userChrome.css with the updated code pasted in from @namespace to #TabsToolbar .titlebar-buttonbox-container {display: none !important;} Still getting nothing. I haven't done any programming since Fortran and Cobol were hot... Yup, I'm that old but not terribly incompetent. Any idea what I'm missing?
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8793 solutions 71933 answers

Hi jcurran516, what exactly are you trying to change?

This --

I have the file userChrome.css with the updated code pasted in from @namespace to #TabsToolbar .titlebar-buttonbox-container {display: none !important;}

-- seems to be referring to a particular set of rules, but what are they?

If you are trying to move the tabs bar from above the main toolbar and bookmarks toolbar to below those two bars:

I made a fresh code extract from the Classic archive and updated the link here:

https://www.userchrome.org/what-is-userchrome-css.html#movetabbar

Also, if this is a new userChrome.css in Firefox 69 or later, or a new profile, flip the switch so Firefox looks for it at startup:

https://www.userchrome.org/firefox-changes-userchrome-css.html#fx69

Hi jcurran516, what exactly are you trying to change? This -- <blockquote>I have the file userChrome.css with '''the updated code''' pasted in from @namespace to #TabsToolbar .titlebar-buttonbox-container {display: none !important;}</blockquote> -- seems to be referring to a particular set of rules, but what are they? '''''If you are trying to move the tabs bar''' from above the main toolbar and bookmarks toolbar to below those two bars:'' I made a fresh code extract from the Classic archive and updated the link here: https://www.userchrome.org/what-is-userchrome-css.html#movetabbar Also, if this is a new userChrome.css in Firefox 69 or later, or a new profile, flip the switch so Firefox looks for it at startup: https://www.userchrome.org/firefox-changes-userchrome-css.html#fx69
Was this helpful to you?
Quote
jcurran516 0 solutions 4 answers

Trying to get tabs back on the bottom.

Trying to get tabs back on the bottom.
Was this helpful to you?
Quote
cor-el
  • Top 10 Contributor
  • Moderator
17578 solutions 159013 answers

If your current code to get the tabs on bottom isn't working in Firefox 71 then you can add this rule to your userChrome.css or edit an existing rule for #TabsToolbar and add display: block !important;

#TabsToolbar {
 display: block !important;
}
If your current code to get the tabs on bottom isn't working in Firefox 71 then you can add this rule to your userChrome.css or edit an existing rule for <b>#TabsToolbar</b> and add <b>display: block !important;</b> #TabsToolbar { display: block !important; }
Was this helpful to you?
Quote
jcurran516 0 solutions 4 answers

OK got them back on the bottom with the fix above to force it to look for userChrome. Not as pretty as before (loved my rounded tabs) but at least they're in the right place. When I'm feeling brave I'll try to find the rounded tabs part from my old userChrome.css file. (after backing up this one that works!!!) Thanks jscher!!!

OK got them back on the bottom with the fix above to force it to look for userChrome. Not as pretty as before (loved my rounded tabs) but at least they're in the right place. When I'm feeling brave I'll try to find the rounded tabs part from my old userChrome.css file. (after backing up this one that works!!!) Thanks jscher!!!
Was this helpful to you?
Quote
jcurran516 0 solutions 4 answers

I had rounded tabs with a darker background and as mentioned the last I programmed was Fortran but I suspect this might work (stolen from the previous fix code)

} .tab-background {

 border-radius: 12px 12px 0px 0px !important;
 border-image: none !important;
 border-left: 1px solid !important;
 border-right: 1px solid !important;
 border-top: 1px solid !important;
 background-color: #BDBDBD !important;

}

can I just insert this somewhere?

I had rounded tabs with a darker background and as mentioned the last I programmed was Fortran but I suspect this might work (stolen from the previous fix code) } .tab-background { border-radius: 12px 12px 0px 0px !important; border-image: none !important; border-left: 1px solid !important; border-right: 1px solid !important; border-top: 1px solid !important; background-color: #BDBDBD !important; } can I just insert this somewhere?
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8793 solutions 71933 answers

Helpful Reply

jcurran516 said

I had rounded tabs with a darker background and as mentioned the last I programmed was Fortran but I suspect this might work (stolen from the previous fix code)
/* Curved tabs */
.tab-background {
  border-radius: 12px 12px 0px 0px !important;
  border-image: none !important;
  border-left: 1px solid !important;
  border-right: 1px solid !important;
  border-top: 1px solid !important;
  background-color: #BDBDBD !important;
}

can I just insert this somewhere?

You could add it to the end of your rules. I wouldn't try to stick it in the middle.

You also could tweak that out a little further. See the attached screenshot showing the above rules and then the below rules:

/* Curve the background tabs at the upper left and right corners
   May not work on add-on themes. */
.tabbrowser-tab {
  border-radius: 12px 12px 0px 0px !important;
  background-color: #d0d0d0 !important;
}
/* Curve active tab and slightly overlap neighboring tabs */
.tabbrowser-tab .tab-background[selected="true"] {
  margin-left: -2px !important;
  margin-right: -2px !important;
  border-radius: 12px 12px 0px 0px !important;
}
/* Shorten the tab line along the tops of tabs */
.tab-line {
  margin-left: 9px !important;
  margin-right: 9px !important;
}
/* Shorten the vertical lines between background tabs */
.tabbrowser-tab::before, .tabbrowser-tab::after {
  margin-top: 9px !important;
}

/** "Light" Theme (Dark Text) **/

/* Border the background tabs (40% gray) for greater visibility */
#main-window:not([lwthemetextcolor="bright"]) .tabbrowser-tab:not([selected="true"]) {
  border: 1px solid rgba(0,0,0,.4) !important;
  border-bottom-color: transparent !important;
  margin-right: -1px !important;
}
/* Remove short vertical lines between background tabs */
#main-window:not([lwthemetextcolor="bright"]) .tabbrowser-tab::before, 
#main-window:not([lwthemetextcolor="bright"]) .tabbrowser-tab::after {
  border: none !important;
}
''jcurran516 [[#answer-1271860|said]]'' <blockquote> I had rounded tabs with a darker background and as mentioned the last I programmed was Fortran but I suspect this might work (stolen from the previous fix code) <pre>/* Curved tabs */ .tab-background { border-radius: 12px 12px 0px 0px !important; border-image: none !important; border-left: 1px solid !important; border-right: 1px solid !important; border-top: 1px solid !important; background-color: #BDBDBD !important; } </pre> can I just insert this somewhere? </blockquote> You could add it to the end of your rules. I wouldn't try to stick it in the middle. You also could tweak that out a little further. See the attached screenshot showing the above rules and then the below rules: <pre>/* Curve the background tabs at the upper left and right corners May not work on add-on themes. */ .tabbrowser-tab { border-radius: 12px 12px 0px 0px !important; background-color: #d0d0d0 !important; } /* Curve active tab and slightly overlap neighboring tabs */ .tabbrowser-tab .tab-background[selected="true"] { margin-left: -2px !important; margin-right: -2px !important; border-radius: 12px 12px 0px 0px !important; } /* Shorten the tab line along the tops of tabs */ .tab-line { margin-left: 9px !important; margin-right: 9px !important; } /* Shorten the vertical lines between background tabs */ .tabbrowser-tab::before, .tabbrowser-tab::after { margin-top: 9px !important; } /** "Light" Theme (Dark Text) **/ /* Border the background tabs (40% gray) for greater visibility */ #main-window:not([lwthemetextcolor="bright"]) .tabbrowser-tab:not([selected="true"]) { border: 1px solid rgba(0,0,0,.4) !important; border-bottom-color: transparent !important; margin-right: -1px !important; } /* Remove short vertical lines between background tabs */ #main-window:not([lwthemetextcolor="bright"]) .tabbrowser-tab::before, #main-window:not([lwthemetextcolor="bright"]) .tabbrowser-tab::after { border: none !important; } </pre>
Was this helpful to you? 1
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.