X
Πατήστε εδώ για μετάβαση στην έκδοση της ιστοσελίδας για κινητές συσκευές.

Φόρουμ υποστήριξης

Reduce buffer between Bookmark Toolbar icons?

Δημοσιεύτηκε

I just updated from a much older version of Firefox, and now fewer bookmark icons fit in my bookmarks toolbar. I'm hoping there's a way in about:config that I can reduce the buffer space between Bookmarks Toolbar icons.

(Yes, I already deleted the names on the bookmarks in my toolbar, I'm way past that for many years now.)

Would really appreciate some quick pointers on this, since it's dumped 18 icons into the expansion area....

I just updated from a much older version of Firefox, and now fewer bookmark icons fit in my bookmarks toolbar. I'm hoping there's a way in about:config that I can reduce the buffer space between Bookmarks Toolbar icons. (Yes, I already deleted the names on the bookmarks in my toolbar, I'm way past that for many years now.) Would really appreciate some quick pointers on this, since it's dumped 18 icons into the expansion area....
Παράθεση

Επιπρόσθετες λεπτομέρειες συστήματος

Εγκατεστημένα αρθρώματα

  • Shockwave Flash 32.0 r0

Εφαρμογή

  • Πλατφόρμα χρήστη: Mozilla/5.0 (Windows NT 6.1; rv:67.0) Gecko/20100101 Firefox/67.0

Περισσότερες πληροφορίες

jscher2000
  • Top 10 Contributor
8684 λύσεις 70998 απαντήσεις
Δημοσιεύτηκε

Hi Josslyn81, unfortunately there is no built-in setting for toolbar button spacing, you would need to create a userChrome.css file and add a rule that tweaks the margins.

Actually, there are many possible adjustments you can make, such as shortening the space for text labels (or hiding them), moving the icons closer to the text, etc.

Here's a rough idea of the spacing "out of the box" which you might consider adjusting:

Let's say you want to cut those 4 pixel gaps down to 2 pixels. A custom style rule for that might be:

#PlacesToolbar toolbarbutton {
  padding-left: 2px !important;
  padding-right: 2px !important;
}
#PlacesToolbar toolbarbutton .toolbarbutton-icon {
  margin-right: 2px !important;
}

Then to apply that to your Firefox, when you have 10 minutes to dive into it, this is how you set it up:

This assumes you do not already have a userChrome.css file. If you do already have a working userChrome.css file, you just need to add the above rule to your file.

(A) Select and copy the above style rule code

(B) Generate and download a userChrome.css file

Open the following page and paste the above rules into the editor, replacing the sample rule:

https://www.userchrome.org/download-userchrome-css.html

Then click "Generate CSS File" and save the userChrome.css file to your computer. (See first attached screenshot)

Use the downloads list on the toolbar to open the downloads folder directly to the new userChrome.css file. (See second attached screenshot)

Minimize that Windows Explorer window for later reference.

(C) Create a new chrome folder in your profile folder

The following article has the detailed steps for that (#1, #2, and I recommend #3)

https://www.userchrome.org/how-create-userchrome-css.html

There are boring videos for Windows and Mac if you like videos.

(D) Move the userChrome.css file you generated in Step B into the chrome folder you created in Step C

The next time you exit Firefox and start it up again, it should discover that file and apply the rules.

Success?

Hi Josslyn81, unfortunately there is no built-in setting for toolbar button spacing, you would need to create a userChrome.css file and add a rule that tweaks the margins. Actually, there are many possible adjustments you can make, such as shortening the space for text labels (or hiding them), moving the icons closer to the text, etc. Here's a rough idea of the spacing "out of the box" which you might consider adjusting: <img src="https://prod-cdn.sumo.mozilla.net/uploads/images/2019-05-31-13-16-07-318090.png"> Let's say you want to cut those 4 pixel gaps down to 2 pixels. A custom style rule for that might be: <pre>#PlacesToolbar toolbarbutton { padding-left: 2px !important; padding-right: 2px !important; } #PlacesToolbar toolbarbutton .toolbarbutton-icon { margin-right: 2px !important; } </pre> Then to apply that to your Firefox, when you have 10 minutes to dive into it, this is how you set it up: ''This assumes you do not already have a userChrome.css file. If you ''do'' already have a working userChrome.css file, you just need to add the above rule to your file.'' '''(A) Select and copy the above style rule code''' '''(B) Generate and download a''' <code>userChrome.css</code> '''file''' Open the following page and paste the above rules into the editor, replacing the sample rule: https://www.userchrome.org/download-userchrome-css.html Then click "Generate CSS File" and save the userChrome.css file to your computer. (See first attached screenshot) Use the downloads list on the toolbar to open the downloads folder directly to the new userChrome.css file. (See second attached screenshot) Minimize that Windows Explorer window for later reference. '''(C) Create a new''' <code>chrome</code> '''folder in your profile folder''' The following article has the detailed steps for that (#1, #2, and I recommend #3) https://www.userchrome.org/how-create-userchrome-css.html There are boring videos for Windows and Mac if you like videos. '''(D) Move the''' <code>userChrome.css</code> '''file you generated in Step B into the''' <code>chrome</code> '''folder you created in Step C''' The next time you exit Firefox and start it up again, it should discover that file and apply the rules. Success?
Σάς φάνηκε χρήσιμο;
Παράθεση
jscher2000
  • Top 10 Contributor
8684 λύσεις 70998 απαντήσεις
Δημοσιεύτηκε

Now that I re-read your question:

Since you removed the text labels, you don't need any right margin after the icon to separate it from the text. So the second part can be revised down to zero:

/* Space between button boundary and content*/
#PlacesToolbar toolbarbutton {
  padding-left: 2px !important;
  padding-right: 2px !important;
}
/* Spacing after icon, before text */
#PlacesToolbar toolbarbutton .toolbarbutton-icon {
  margin-right: 0px !important;
}
Now that I re-read your question: Since you removed the text labels, you don't need any right margin after the icon to separate it from the text. So the second part can be revised down to zero: <pre>/* Space between button boundary and content*/ #PlacesToolbar toolbarbutton { padding-left: 2px !important; padding-right: 2px !important; } /* Spacing after icon, before text */ #PlacesToolbar toolbarbutton .toolbarbutton-icon { margin-right: 0px !important; } </pre>
Σάς φάνηκε χρήσιμο;
Παράθεση
cor-el
  • Top 10 Contributor
  • Moderator
17467 λύσεις 157838 απαντήσεις
Δημοσιεύτηκε

Note that you can hide the text labels easily via userChrome.css, so if you have use userChrome.css then you can add such a rule and no longer need to edit the name.

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

/* hide bookmark label, leave folder label */
#personal-bookmarks .bookmark-item:not([container=true]) .toolbarbutton-text {
 display:none!important;
}
Note that you can hide the text labels easily via userChrome.css, so if you have use userChrome.css then you can add such a rule and no longer need to edit the name. <pre><nowiki>@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */ /* hide bookmark label, leave folder label */ #personal-bookmarks .bookmark-item:not([container=true]) .toolbarbutton-text { display:none!important; } </nowiki></pre>
Σάς φάνηκε χρήσιμο;
Παράθεση
Κάντε μια ερώτηση

Πρέπει να συνδεθείτε στο λογαριασμό σας για να απαντήσετε στις δημοσιεύσεις. Παρακαλούμε ξεκινήστε μια νέα ερώτηση, αν δεν έχετε ήδη λογαριασμό.