This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

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

Increase toolbar spacing?

  • 4 svar
  • 1 har dette problemet
  • 28 views
  • Siste svar av Mugsy

more options

Is there a way to increase the spacing between toolbars?

I prefer my tabs just above the page and below the URL & "Bookmarks" toolbars so I found the CSS code to move them, but I had to make their text bigger to read, and now my bars are overlapping each other (see attached photo.)

Is there a way to increase the spacing between toolbars so they don't overlap? TIA.

Is there a way to increase the spacing between toolbars? I prefer my tabs just above the page and below the URL & "Bookmarks" toolbars so I found the CSS code to move them, but I had to make their text bigger to read, and now my bars are overlapping each other (see attached photo.) Is there a way to increase the spacing between toolbars so they don't overlap? TIA.
Attached screenshots

Valgt løsning

Hi Mugsy, I think you might have a mix of two different sets of Tab Bar rules, most for a single-row tab bar and some later ones for a multi-row tab bar. Could I suggest using my updated extract of the rules from Aris' "Classic" site (updated through Firefox 71) plus a few rules from your set that look like you added them, and see whether it works?

You can download the extract here:

https://www.userchrome.org/what-is-userchrome-css.html#movetabbar

The personal rules:

/*** === PERSONAL STUFF === ***/

/* Make Bookmarks Toolbar bigger by increasing font-size */
#personal-bookmarks .bookmark-item .toolbarbutton-text {
 font-size: 10pt !important;
}

/* tabs toolbar */
#navigator-toolbox #TabsToolbar {
 font-size: 10pt !important;
}

The point of having that obnoxious heading is so if you need to replace the other parts, you won't lose track of where your modifications are.

And then to push the Tabs bar down a little bit from the Bookmarks bar:

/* Add blank space between Bookmarks and Tabs bars */
#personal-bookmarks {
  margin-bottom: 6px !important;
}
Les dette svaret i sammenhengen 👍 1

All Replies (4)

more options

Hi Mugsy, you'll need something custom because it depends on how your current rules position things.

If you need to share your userChrome.css rules, please use a site like Pastebin. You can create a new "Paste" without creating an account and share it using a link. Below the area where you paste, there is an option for syntax coloring: please select CSS as the language so it's a bit nicer to read than plain text.

more options

Thanks for the reply. I posted my userChrome.css here:

https://pastebin.com/0tYwvmii

Most of it was downloaded from Mozilla with a few minor edits of my own. TIA

more options

Valgt løsning

Hi Mugsy, I think you might have a mix of two different sets of Tab Bar rules, most for a single-row tab bar and some later ones for a multi-row tab bar. Could I suggest using my updated extract of the rules from Aris' "Classic" site (updated through Firefox 71) plus a few rules from your set that look like you added them, and see whether it works?

You can download the extract here:

https://www.userchrome.org/what-is-userchrome-css.html#movetabbar

The personal rules:

/*** === PERSONAL STUFF === ***/

/* Make Bookmarks Toolbar bigger by increasing font-size */
#personal-bookmarks .bookmark-item .toolbarbutton-text {
 font-size: 10pt !important;
}

/* tabs toolbar */
#navigator-toolbox #TabsToolbar {
 font-size: 10pt !important;
}

The point of having that obnoxious heading is so if you need to replace the other parts, you won't lose track of where your modifications are.

And then to push the Tabs bar down a little bit from the Bookmarks bar:

/* Add blank space between Bookmarks and Tabs bars */
#personal-bookmarks {
  margin-bottom: 6px !important;
}
more options

jscher2000 said

Hi Mugsy, I think you might have a mix of two different sets of Tab Bar rules

Thank you. That appears to have worked.

I increased the font size of my toolbars to make them slightly larger using this code:

/* Make Bookmarks Toolbar bigger by increasing font-size */
#personal-bookmarks .bookmark-item .toolbarbutton-text { font-size: 10.5pt !important;
}
/* tabs toolbar */
#navigator-toolbox #TabsToolbar {
-moz-box-ordinal-group: 100 !important;
font-size: 10pt !important;
}

...and the toolbar spacing shifted to match. Thanks.