Score:5

Firefox: How to reduce height of bars

in flag

I am running Firefox 90.0 on Ubuntu Mate 18.04 32-bit. It seems that Firefox'es tabs and menu bar are optimized for smartphones as they are twice as high as the bars of all other programs. My netbook has a small screen and so I'd like to reduce them to ordinary size. How/is that possible?

Score:13
bo flag

OPTION ONE:

First, go to about:config in your URL bar.

Then, search for browser.compactmode.show and change the value to true .

Finally, go to the Hamburger-Menu > More-tools > Customize-toolbar and at the bottom of the page, click Density and select Compact.


OPTION TWO (recommended):

First, go to about:config in your URL bar.

Then, search for layout.css.devPixelsPerPx

Finally, double click on the value and change it to less than 1.0. After you set the value, press ENTER to apply the changes. For example, you can use 0.75 or if that is too big, you could try 0.5.

Shakesbeer avatar
in flag
Won't option two affect the whole browser window content?
Shakesbeer avatar
in flag
I tried option one, even though the respective settings tab seems to have some bugs: When I had done the registry changes, the dropdown setting showed the compact mode option but claimed it is not supported. Anyway, at least the tab bar got more compact. But now the "text menu bar" (the one that says "Files, Edit, View, ...") has reappeared, it wasn' there before when I had disabled the window bar.
Shakesbeer avatar
in flag
Now why is compact mode hidden by default? This is a good example for software creators' ignorance of the users' needs. Instead of giving the choice, they try to push something on us. Do FF developers think that everybody uses a touchscreen (I don't mention smartphones because there's a separate FF version for those) nowadays and that they can simply ignore the traditional desktop user, maybe we're out of fashion or what? i don't even mention the Ubuntu 18.04 "icons-GUI" (a decade after Microsoft's Windows 8)... SCNR, but all this "elephant fingers layout" all over the WWW makes me so angry!
mchid avatar
bo flag
@Shakesbeer I think "files, edit, and view" are part of the Title Bar. In any case, you can usually make this menu appear and disappear by pressing the ALT key. Alternatively, you can also Right-Click in the tab area and then check the "Menu" box to show this menu.
mchid avatar
bo flag
@Shakesbeer As for them removing Compact mode, I think they did this because it's not very compatible with themes. On my computer, it makes very little difference when I select Compact mode so I use the layout.css.devPixelsPerPx option to reduce the size.
Score:3
in flag

If you are referring to the header bar in Firefox v90 then there are facilities to remove it.

  • Click on the 3 lines (so called hamburger) icon to open Firefox menu.
  • Click More Tools then "Customise …” menu option to open new Customise Firefox tab.
  • Finally un-check the “Title Bar” check-box in the bottom-left.

reference

Shakesbeer avatar
in flag
I just noticed I had done that already and confused the window bar with the tabs bar (I will edit my question). I think disabling it may count as a way of shrinking it. But what about the tabs and menu bar size, I don't want to disable those bars.
Score:1
re flag

Here is a Firefox userChrome.css file that reduces the tab and navigation bar heights to increase available screen space:

SlimBarsFirefox

:root {
  --tab-max-height: 24px !important;
  --tab-min-height: 0 !important;
  --urlbar-toolbar-height: var(--tab-max-height) !important;
}

/* Bar resizing */
#nav-bar,
.toolbar-items,
.titlebar-buttonbox-container,
.tab-content,
.tab-background,
.tab-label-container {
  height: var(--tab-max-height);
}
.tab-background {
  margin: 0 !important;
}
.tab-secondary-label {
  font-size: .5em !important;
  margin: -.6em 0 .5em !important;
}

/* Selection highlight */
#nav-bar toolbaritem,
#nav-bar toolbarbutton {
  --focus-outline: none;
  --slimbar-highlight-color: color-mix(in srgb, var(--lwt-toolbar-field-highlight) 40%, var(--toolbar-bgcolor));
  /* --toolbar-field-focus-background-color: var(--slimbar-highlight-color); */
}
#nav-bar toolbaritem:focus-visible,
#nav-bar toolbarbutton:focus-visible,
#nav-bar toolbaritem #identity-icon-box:focus-visible,
#nav-bar toolbaritem #star-button-box:focus-visible,
#nav-bar toolbaritem .unified-extensions-item-action-button:focus-visible {
  background-color: var(--slimbar-highlight-color) !important;
}
mangohost

Post an answer

Most people don’t grasp that asking a lot of questions unlocks learning and improves interpersonal bonding. In Alison’s studies, for example, though people could accurately recall how many questions had been asked in their conversations, they didn’t intuit the link between questions and liking. Across four studies, in which participants were engaged in conversations themselves or read transcripts of others’ conversations, people tended not to realize that question asking would influence—or had influenced—the level of amity between the conversationalists.