Skip to content

Instantly share code, notes, and snippets.

@BenoitAverty
Last active July 22, 2023 13:32
Show Gist options
  • Save BenoitAverty/af633ee20e27f48f9ba7178451432206 to your computer and use it in GitHub Desktop.
Save BenoitAverty/af633ee20e27f48f9ba7178451432206 to your computer and use it in GitHub Desktop.
Hide tab bar on firefox 89 when there is only one tab
/*
How To:
1. Find your firefox profile folder : https://support.mozilla.org/en-US/kb/profiles-where-firefox-stores-user-data
2. create a "chrome" folder if it doesn't exist
3. Paste content of this gist in a "userChrome.css" file
4. Go to about:config and set toolkit.legacyUserProfileCustomizations.stylesheets to true
5. set browser.tabs.tabmanager.enabled to false (to hide the "tab search" button)
5. Restart Firefox
Don't hesitate to say if there are bugs, I only tested this for my workflow : I don't use tabs
at all but I want to see the bar if I open a tab by mistake (otherwise I sometimes lose a tab)
*/
/* Copy the default settings for --tab-min-height as --hidetabs-tab-min-height */
:root {
--hidetabs-tab-min-height: 33px;
}
:root[uidensity=compact] {
--hidetabs-tab-min-height: 29px;
}
:root[uidensity=touch] {
--hidetabs-tab-min-height: 41px;
}
/* Set --tab-min-height to 0px so tab bar can disappear */
#tabbrowser-tabs {
--tab-min-height: 0px;
}
/* Restore minimum height when more than one tab */
#tabbrowser-tabs tab {
min-height: var(--hidetabs-tab-min-height);
}
/* Collapse tab bar when there is only one tab (tab is both first & last) */
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
visibility: collapse;
}
/* Hide the New Tab button when there is only one tab (first visible tab is
adjacent to new tab button) */
#tabbrowser-tabs tab[first-visible-tab="true"] + #tabs-newtab-button {
visibility: collapse;
}
@eromatiya
Copy link

I have a centered .tab-label-container. The css works perfectly, but adding a new tab will remove its centeredness. Here's my workaround:

#tabbrowser-tabs {
	--tab-min-height: 0px;
}

#tabbrowser-tabs tab:only-of-type,
#tabbrowser-tabs tab:only-of-type + #tabs-newtab-button {
	display: none !important;
}

image

@clickityclick
Copy link

I also can't get the tab bar to disappear with FF78.1 ESR when only one tab is present. The tab is hidden, but the space is not freed up to show more content.

I'm using @import "./css/tabs/tabs_below_navigation_toolbar.css"; /**/
from Classic CSS tweaks for Firefox Quantum v3.1.6 by Aris-t2

FF78woTabs

@blackcrack
Copy link

blackcrack commented Nov 22, 2022

Search Tabs

if this downward arrow disturb you and you have add this cromefolder with this script,
and it is only this p.....ed downward arrow nerves you still:

"
if you have an "Tab Search" set "browser.tabs.tabmanager.enabled" to false do disable it
a restart of the browser is need !
"

@BenoitAverty could you add these 2 lines into your script for help to remove the
the space of the Tab fully.. i have in Fedora FF106 and have first to search an solution
and found it lucky wise .. i have add this 2 lines on my copy of your userCrome.css
for never forgot ;)

best

edit : 2023 07 22
FF 115 :

/* Set minimum height to 0px so tab bar can disappear */
#tabbrowser-tabs {
    --tab-min-height: 0px;
}

/* Collapse tab bar when there is only one tab (tab is both first & last) */
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
    visibility: collapse;
}

/* Hide the New Tab button when there is only one tab (first visible tab is
   adjacent to new tab button) */
#tabbrowser-tabs tab[first-visible-tab="true"] + #tabs-newtab-button {
    visibility: collapse;
}

thank you for the update, it works 🎉 should add to your code :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment