Windows 10 reached EOS (end of support) on October 14, 2025. If you are on Windows 10, see this article.

חיפוש בתמיכה

יש להימנע מהונאות תמיכה. לעולם לא נבקש ממך להתקשר או לשלוח הודעת טקסט למספר טלפון או לשתף מידע אישי. נא לדווח על כל פעילות חשודה באמצעות האפשרות ״דיווח על שימוש לרעה״.

מידע נוסף
נפתרה Archived

How to use userChrome.css to move favicon and text on tabs up 3px and left 2px

Gojira replied
Gojira

I would like to control the positioning of the favicon and text which appears on the tabs. I'm hoping this will be possible by using userChrome.css. Also, would it be possible to reduce the height of the background behind the tabs with userChrome.css?

My goal is basically to reduce the height of the tabs and the background behind the tabs.

Thanks

I would like to control the positioning of the favicon and text which appears on the tabs. I'm hoping this will be possible by using userChrome.css. Also, would it be possible to reduce the height of the background behind the tabs with userChrome.css? My goal is basically to reduce the height of the tabs and the background behind the tabs. Thanks

כל התגובות (2)

פתרון נבחר

You can find the relevant code for the tab bar height in this file that you can open via the location bar.

  • chrome://browser/skin/browser.css

I use code like this to adjust the height:

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

/* Tab bar: adjust height - chrome://browser/skin/browser.css */
#tabbrowser-tabs,
.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
  min-height: 24px!important;
}
#tabbrowser-tabs {height:26px!important;}
#tabbrowser-tabs toolbar button > .toolbarbutton-icon { padding-bottom:2px !important; }

For the icon and the text you can modify the padding or margin of those elements with these selectors:

.tab-text {padding-bottom:3px !important; }
.tab-throbber, .tab-icon-image  {padding-left:2px !important; }

This has achieved exactly what I wanted!!!

Thank you for you help!!! d(^_^)