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

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.

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?

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

Trying to get tabs back on the bottom.

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;
}

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!!!

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?

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;
}