T O P

  • By -

SENDMEJUDES

Your code seems to not working. Delete everything inside your userchrome.css file and enter something simple like this to see if it works: .tabbrowser-tab { opacity:0.3!important; } Your tabs should be semi-transparent now.


iandunn

Doh, you're right, thanks! `userChrome.css` is being loaded, and the rules are valid, but DevTools is inside the `toolbox-panel-iframe-inspector` `iframe`, so the rules aren't applied to it. Same problem as these unresolved posts: * [https://www.reddit.com/r/FirefoxCSS/comments/d3lbz0/how\_to\_theme\_developer\_tools\_inspector\_code\_in/](https://www.reddit.com/r/FirefoxCSS/comments/d3lbz0/how_to_theme_developer_tools_inspector_code_in/) * [https://www.reddit.com/r/FirefoxCSS/comments/cjlsei/userchromecss\_not\_applying\_in\_devtools/](https://www.reddit.com/r/FirefoxCSS/comments/cjlsei/userchromecss_not_applying_in_devtools/) I'm reading more and experimenting with some things, but so far no luck. * { /* this works */ border: 10px solid yellow !important; } @-moz-document url-prefix("about:devtools-toolbox") { * { /* this doesn't work */ border: 10px solid blue !important; } } @-moz-document url-prefix("chrome://devtools/content/") { * { /* this doesn't work */ border: 10px solid green !important; } }


iandunn

Ah, it's gotta be `userContent.css`, not `userChrome.css`! This works: /* Tab bar */ @-moz-document url-prefix("about:devtools-toolbox") { * { color: pink !important; } } /* Tab contents */ @-moz-document url-prefix("chrome://devtools/content/") { * { color: orange !important; } :root { --theme-body-font-size: 18px !important; --theme-code-font-size: 18px !important; } } [source](http://forums.mozillazine.org/viewtopic.php?f=38&t=3058698)


[deleted]

[удалено]


iandunn

It was originally `true`, but I flipped it after [seeing it suggested on StackOverflow](https://stackoverflow.com/questions/67834839/firefox-89-doesnt-see-userchrome-css-even-set-toolkit-legacyuserprofilecustomiz).