Thanks for that link. I'll have to subscribe to Reddit and take a look at the discussion.

Sorry: question posted in error. Apologies.

I'm happy to report that I'm almost there, with the layout and most of the colour choices now working in version 127.0 running on Windows 10.

There's one thing I can't sort out: I'd like to have a tab change background colour when hovered over. This is the code, inherited from the previous PC:

[hash] TabsToolbar:not(:-moz-lwtheme) { [hash] tabbrowser-tab:not([selected="true"]):hover [hash] tab-background

  background-color: red !important;

}

I don't know if giving that in isolation is actually helpful or not, since it could be being overridden by something else that I'm not recognising, but just in case the problem is in these lines I thought it might be worth posting them. Am I overlooking something obvious?

Many thanks.

#TabsToolbar:not(:-moz-lwtheme) {
#tabbrowser-tab:not([selected="true"]):hover
#tab-background
   background-color: red !important;
}

That isn't legal CSS. I think they meant for it to be this:

#TabsToolbar:not(:-moz-lwtheme) #tabbrowser-tab:not([selected="true"]):hover #tab-background {
   background-color: red !important;
}

jscher2000, thanks for that; I'll give it a go.

jscher2000, unfortunately it didn't work: the problem must lie elsewhere. I think I might start again from scratch with a newly-created profile, checking at each stage. I have the current one safely stored in duplicate and I can always revert to it if I don't get anywhere with a new one.

Actually, that earlier CSS had a hash (meaning id="") where it should have had a dot (meaning class=""). So if I had tested it, I would have known that it can't work.

In Firefox 133, the style rule for hover color for background tabs is written in a new way:

.tab-background {
  .tabbrowser-tab:hover > .tab-stack > &:not([selected], [multiselected]) {
    background-color: var(--tab-hover-background-color);
    outline-color: var(--tab-hover-outline-color);
  }
}
 

I never learned the proper use of the & references to write inside-out CSS. However, I do know how to copy and replace. Try this:

/* Background tab hover colors for Fx133 */
.tab-background {
  .tabbrowser-tab:hover > .tab-stack > &:not([selected], [multiselected]) {
    background-color: red !important;
    outline-color: black !important;
  }
}

Thanks for that; I'll try it as soon as I can. In 133 has anything changed in the coding to set overall colours for the tabs, and a colour for the selected tab? I'd also like to change the background colours for the tab bar and the File, Edit, View... bar: I'll try my existing codes for that and see what happens.

Looking into this, it's clear that the tabs-below-the-address-bar issue is a long-standing moan. And I see that people are complaining that each new FF update tends to break any css code for doing the move. I really don't understand why the option hasn't long since been included as a simple choice in Settings.

I gave up trying to stay on top of changes a few years ago. There are always little changes, occasionally big changes, and the popular Github repositories and r/FirefoxCSS are the go-to resources for updated code.

I saw a stern warning that versions of FF earlier than the current one would no longer function correctly after some date in January. Assuming that's true and not just scare-mongering, I suppose I must update to 133 and try to make my previous layout- and colour changes work, and since the principal one is placing the tabs below the address bar I'm looking for a 133-friendly version of the coding. Cor-el also recommended Reddit and I plan to check that out, as well as the Github resources.

Thanks again.

jscher2000, I installed v133 and tried your hover coding. At first it didn't have any effect but then I remembered to alter the toolkit.legacyUserProfileCustomizations.stylesheets setting to true and now it works perfectly. Hopefully that first successful tweak will pave the way for some more.

Thanks again.

A very belated update (Christmas got in the way) to say that I've now managed to get the tabs bar beneath the address bar in v 133. I used this file by MrOtherGuy from GitHub.

I haven't yet succeeded in making most of the other changes I had back with v122, though jscher2000's code to change the hover colour on inactive tabs does work, so that's a good start. I'd like to alter the colour of the tab bar (that's to say the background), and also introduce vertical spaces between the tabs, at the very least. Any pointers in the right direction will be very welcome; thanks.

I saw a stern warning that versions of FF earlier than the current one would no longer function correctly after some date in January. Assuming that's true and not just scare-mongering,

Not sure about January however starting March 14, 2025 your Extensions may not work if you do not have Firefox 128 or later or 115.13.0+esr or later. https://support.mozilla.org/en-US/kb/root-certificate-expiration

James, I'm certain that the warning I saw specified January 2025 (and a definite date, though I don't recall what it was) after which my then version of Firefox (122.0.1) would no longer display some video files correctly. It just appeared in a new tab and I've not seen it again - though now I've updated to v 133 I suppose I shouldn't expect to. Very strange.