Where did you install Firefox from? Help Mozilla uncover 3rd party websites that offer problematic Firefox installation by taking part in our campaign. There will be swag, and you'll be featured in our blog if you manage to report at least 10 valid reports!

Avatar for Username

Pomoc pśepytaś

Glědajśo se wobšudy pomocy. Njenapominajomy was nigda, telefonowy numer zawołaś, SMS pósłaś abo wósobinske informacije pśeraźiś. Pšosym dajśo suspektnu aktiwitu z pomocu nastajenja „Znjewužywanje k wěsći daś“ k wěsći.

Learn More

Specific CSS rule in my userChrome.css doesn't work.

  • 2 wótegronje
  • 0 ma toś ten problem
  • 1 naglěd
  • Slědne wótegrono wót cor-el

protocol
protocol
more options

Hi thanks for clicking.

I'm on Linux, Zorin OS, which is Ubuntu based if I'm not mistaken, very new to Linux.

Anyway, I've made a userChrome.css and done some changes I like to Firefox. It has been working fine until I tried to change the tab bar's overflow shadows when there are more tabs than there is space in the bar.

The rest of the css edits I've made in userChrome.css works fine but this overflow shadow reference Firefox just doesn't grab. I can live edit with the Toolbox and then it works fine, but when opening Firefox as default this css definition is as if gone.

Image 1: after live edit with Toolbox Image 2: before live edit with Toolbox Image 3: my userChrome.css

What can I do to fix this?

Thanks / p

Hi thanks for clicking. I'm on Linux, Zorin OS, which is Ubuntu based if I'm not mistaken, very new to Linux. Anyway, I've made a userChrome.css and done some changes I like to Firefox. It has been working fine until I tried to change the tab bar's overflow shadows when there are more tabs than there is space in the bar. The rest of the css edits I've made in userChrome.css works fine but this overflow shadow reference Firefox just doesn't grab. I can live edit with the Toolbox and then it works fine, but when opening Firefox as default this css definition is as if gone. Image 1: after live edit with Toolbox Image 2: before live edit with Toolbox Image 3: my userChrome.css What can I do to fix this? Thanks / p
Pśipowjesone fota wobrazowki

Wšykne wótegrona (2)

protocol
protocol Pšašaŕ
more options

The images got swapped, they're in the wrong order now but you get what's going on.

Wužytny?

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

You can't cross Shadow DOM with code in userChrome.css, so ::part won't work. You can specify a CSS variable in the first part and use that variable in the shadow DOM ::part.

I think that code like this will work: 

#tabbrowser-arrowscrollbox:not([scrolledtostart]),
#tabbrowser-arrowscrollbox:not([scrolledtoend]) {
 --part-overflow-start-indicator: radial-gradient(...); 
}
spacer[part="overflow-start-indicator"],
spacer[part="overflow-end-indicator"] {
  background-image: var(--part-overflow-start-indicator) 1mportant;
}

Wužytny?

Stajśo pšašanje

Musyśo se pla swójogo konta pśizjawiś, aby na pśinoski wótegronił. Pšosym stajśo pšašanje, jolic hyšći njamaśo wužywaŕske konto.