לאתר זה תהיה פונקציונליות מוגבלת בזמן שאנו מתחזקים אותו לשיפור החוויה שלך. אם מאמר מסויים לא פותר את הבעיה שלך וברצונך לשאול שאלה, קהילת התמיכה שלנו מחכה לעזור לך ב־Twitter תחת ‎@FirefoxSupport וב־Reddit תחת ‎/r/firefox.

Avatar for Username

חיפוש בתמיכה

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

מידע נוסף

אשכול זה הועבר לארכיון. נא לשאול שאלה חדשה אם יש לך צורך בעזרה.

How to reduce the height of the titlebar and tabs-bar in Firefox?

  • 1 תגובה
  • 6 have this problem
  • 1 view
  • תגובה אחרונה מאת Ric

Ric
Ric
more options

Hi all,

Thanks for your attention.

I am using the last version of Mozilla Firefox on Windows 7.

I want to reduce the height of the title bar and tabs bar, in order to save a much space as possible. Now, my title-bar and tabs-bar look like in the attached picture (default height, default theme). I want to kill all that blue space in terms of height. I'd like the blue region (I guess is the tabs-bar) to be as tall as a classic Windows Explorer title bar, which is 18 pixels (picture attached). Then, I'd like the grey area below (containing the address bar, the icons of Home, Add-ons, Bookmarks and so on and so forth) to be reduced too, to a height that is the minimum required to host the address bar, or maybe just 1 or 2 pixels more than that. If necessary, I would reduce all icons too, to fit in it. I want to do it manually (no external add-ons).

I have already created chrome folder within the active profile folder and user.Chrome.css file (plain text, .css, UTF-8). I have tried a number of code lines to customize the tab height, read here and there around this and external websites, but still it does not work. It seems that Firefox ignores the .css file. To be accurate, if I increase the height, it works, if I decrease, it does not, like if there is a minimum threshold.

I currently have the following text in my .css file (my last trial): 

@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: 18px!important;
}
#tabbrowser-tabs {height:18px!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; }

Can you help me to reach my target?

User157954

Hi all, Thanks for your attention. I am using the last version of Mozilla Firefox on Windows 7. I want to reduce the height of the title bar and tabs bar, in order to save a much space as possible. Now, my title-bar and tabs-bar look like in the attached picture (default height, default theme). I want to kill all that blue space in terms of height. I'd like the blue region (I guess is the tabs-bar) to be as tall as a classic Windows Explorer title bar, which is 18 pixels (picture attached). Then, I'd like the grey area below (containing the address bar, the icons of Home, Add-ons, Bookmarks and so on and so forth) to be reduced too, to a height that is the minimum required to host the address bar, or maybe just 1 or 2 pixels more than that. If necessary, I would reduce all icons too, to fit in it. I want to do it manually (no external add-ons). I have already created chrome folder within the active profile folder and user.Chrome.css file (plain text, .css, UTF-8). I have tried a number of code lines to customize the tab height, read here and there around this and external websites, but still it does not work. It seems that Firefox ignores the .css file. To be accurate, if I increase the height, it works, if I decrease, it does not, like if there is a minimum threshold. I currently have the following text in my .css file (my last trial): <pre><nowiki>@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: 18px!important; } #tabbrowser-tabs {height:18px!important;} #tabbrowser-tabs toolbar button > .toolbarbutton-icon { padding-bottom:2px !important; } </nowiki></pre> For the icon and the text you can modify the padding or margin of those elements with these selectors: <pre><nowiki>.tab-text {padding-bottom:3px !important; } .tab-throbber, .tab-icon-image {padding-left:2px !important; }</nowiki></pre> Can you help me to reach my target? User157954
צילומי מסך מצורפים

השתנתה ב־ על־ידי cor-el

פתרון נבחר

At the end, I decided to adopt Firefox add-on "Classic Theme Restore"—amazing output. I guess it is impossible to get such a space saving but full furnished solution somehow else.

Read this answer in context 👍 2

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

Ric
Ric Question owner
more options

פתרון נבחר

At the end, I decided to adopt Firefox add-on "Classic Theme Restore"—amazing output. I guess it is impossible to get such a space saving but full furnished solution somehow else.