Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

userChrome.css not working

  • 11 replies
  • 20 have this problem
  • 1 view
  • Last reply by jaf1948

more options

I wish to reduce the line spacing in the Bookmarks sidebar. I found and followed an older thread here to create a userChrome.css file, but it is not working.

Details: System is FF 56.0.2 on MacOS 10.12 Sierra. Path to the css file is: MyUserName/Library/Application Support/Firefox/Profiles/MYPROFILE.default/chrome The css file was saved as plain text and MacOS identifies it as a css style sheet. The content of the css file is:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); .sidebar-placesTree treechildren::-moz-tree-row, .placesTree treechildren::-moz-tree-row {

 height: 1.3em !important;
 border-width: 1px !important;

}

Can anyone please tell me what I'm doing wrong ?

I wish to reduce the line spacing in the Bookmarks sidebar. I found and followed an older thread here to create a userChrome.css file, but it is not working. Details: System is FF 56.0.2 on MacOS 10.12 Sierra. Path to the css file is: MyUserName/Library/Application Support/Firefox/Profiles/MYPROFILE.default/chrome The css file was saved as plain text and MacOS identifies it as a css style sheet. The content of the css file is: @namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); .sidebar-placesTree treechildren::-moz-tree-row, .placesTree treechildren::-moz-tree-row { height: 1.3em !important; border-width: 1px !important; } Can anyone please tell me what I'm doing wrong ?

Modified by johkeeng

Chosen solution

See:

Do you mean something like this for the border?


@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */


@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

.sidebar-placesTreechildren::-moz-tree-row {
  height: 3em !important; /* high value to see whether is works */
}

.sidebar-placesTreechildren::-moz-tree-cell {
  border: 1px solid blue !important;
}

Read this answer in context 👍 1

All Replies (11)

more options

Chosen Solution

See:

Do you mean something like this for the border?


@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */


@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

.sidebar-placesTreechildren::-moz-tree-row {
  height: 3em !important; /* high value to see whether is works */
}

.sidebar-placesTreechildren::-moz-tree-cell {
  border: 1px solid blue !important;
}

more options

cor-el : My thanks -- your script works !!

To get what I wanted, I just changed the last line to border-width: 1px !important;

Can you help me understand why the original script I posted above does not work? Two differences I see are

  • Yours has two @namespace..... lines, one with quotation marks around the http.
  • Yours separates the two instructions (for height and for border) into two separate { .... } brackets.
more options

Some properties only work with specific pseudo classes.

Border works with ::-moz-tree-cell and height works with ::-moz-tree-row

more options

Thank you !!!

more options

johkeeng said

Thank you !!!

You inadvertenly marked your own post as   'Chosen Solution'   -   you can rectify that by clicking on the   'Undo'  button to the right of that post and then mark cor-el's post as 'Chosen Solution'.

Thank you in advance  !

('Glad your problem got solved  !)

more options

Happy112 - thank you, and ... done.

more options

I also have this problem which also started with FF 56.0.2 on MacOS 10.12 Sierra but am now on OS 10.13.1.

Just to clarify, I want to reduce the spacing in the bookmark sidebar as the gap between items is too wide.

FF seems to ignore my userChrome file altogether. I have put in the code that in on this solution and also the solution in https://support.mozilla.org/en-US/questions/975714#answer-495296 but nothing changes, even when I change the values for height or border width. The .css file is definitely in the right place so some help would be appreciated please.

more options

jaf1948 -- Just copy/paste cor-el's text above into your userChrome.css file, and change the last line to "border-width: 1px !important;". It worked for me. If you don't like the height, you can just edit the height value (I use 1.3 instead of 3).

The text I tried (see 1st post) was from the discussion you found, but it does not work.

I did ask cor-el above if he (or anyone) can explain what is wrong with the initial text (I assume a misplaced punctuation) but no one has volunteered an explanation.

more options

Thank you for the quick reply. I actually did 2 things - having 2 Macs, I copied the working userChrome.css from my other machine and then cut and pasted your text. Everything now works perfectly.

Thanks again.

more options

jaf1948 -- A correction, if you don't mind: It is cor-el's text that worked, so it is cor-el who deserves all the credit !!

more options

Thank you cor-el !