Increase toolbar spacing?
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.
الحل المُختار
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;
}
Read this answer in context
👍 1
All Replies (4)
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.
Thanks for the reply. I posted my userChrome.css here:
Most of it was downloaded from Mozilla with a few minor edits of my own. TIA
الحل المُختار
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;
}
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.