How to apply style settings?

I want to customize the container style (about:preferences#containers), which is in the common.css file
The style does not apply if you add it to userChrome.css and userContent.css. What to do in this case? Thank you in advance!


  • Can you post the style code? Should be added to userContent.css. Example pics:



  • Of course. This is the default code.

    xul|textbox[focused] {
      border-color: var(--in-content-border-active);
      box-shadow: 0 0 0 1px var(--in-content-border-active),
        0 0 0 4px var(--in-content-border-active-shadow);

    But I can't change the shadows (for example). Changes will be ignored after adding it to the file and restarting the browser. I do not understand what is the matter ...

  • edited March 2019 [?]

    Well, if it's any consolation, I'm not having any luck with that code so far either. So if any of the userContent guru's on here can figure it out, we would both like to know. :)

    Update: Played some, the xul code seems to need the xul namespace, and it doesn't work when the url about:preferences#containers is added. Code below affects the dialog box in the original post pic, but it also affects all xul text boxes.

    @namespace html "";
    @namespace xul "";
        border: 1px solid blue!important;
        border-radius: 8px!important;
        color: red !important;
        background-color:khaki !important;
      box-shadow:3px 3px 0px 0px orange !important;
     .dialogBox, window#ContainersDialog {
      background: gainsboro!important;


  • edited March 2019 [?]

    calico, I came to the same results, and this is bad, because it is not known how to proceed.

  • A good place to ask might be over at the Github repository.

  • The style does not apply to all elements with common.css, and not only to containers.

Sign In or Register to comment.