Hide single tabs in userchrome.css in Firefox version 103.0?

User Help for Mozilla Firefox
Post Reply
Burma
Posts: 32
Joined: June 15th, 2007, 12:35 pm

Hide single tabs in userchrome.css in Firefox version 103.0?

Post by Burma »

Up until Firefox version 103.0, the following worked in my userchrome.css file:

Code: Select all

    /* 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;
    }
The purpose of it is to hide a tab if it’s the only one in the window. For some reason, it stopped working in Firefox version 103.0. Can anyone tell me why?
morat
Posts: 6421
Joined: February 3rd, 2009, 6:29 pm

Re: Hide single tabs in userchrome.css in Firefox version 10

Post by morat »

Use the normal quote character. Don't use the left and right quote characters.

Unicode quote characters
http://www.fileformat.info/info/unicode ... /index.htm
http://www.fileformat.info/info/unicode ... /index.htm
http://www.fileformat.info/info/unicode ... /index.htm

Where is the --hidetabs-tab-min-height variable defined? That variable isn't found in the Fx 102 source.

Reference
http://searchfox.org/mozilla-esr102/sea ... min-height
http://searchfox.org/mozilla-esr102/sea ... min-height

Try this:

Code: Select all

#tabbrowser-tabs {
  min-height: 0px !important;
}
#tabbrowser-tabs tab {
  min-height: 0px !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  visibility: collapse !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
  visibility: collapse !important;
}
Burma
Posts: 32
Joined: June 15th, 2007, 12:35 pm

Re: Hide single tabs in userchrome.css in Firefox version 10

Post by Burma »

Nope, I tried your code and it still doesn't work. I disabled all extensions and have toolkit.legacyUserProfileCustomizations.stylesheets = true.

Does it work for you? Thanks
morat wrote:Use the normal quote character. Don't use the left and right quote characters.

Unicode quote characters
http://www.fileformat.info/info/unicode ... /index.htm
http://www.fileformat.info/info/unicode ... /index.htm
http://www.fileformat.info/info/unicode ... /index.htm

Where is the --hidetabs-tab-min-height variable defined? That variable isn't found in the Fx 102 source.

Reference
http://searchfox.org/mozilla-esr102/sea ... min-height
http://searchfox.org/mozilla-esr102/sea ... min-height

Try this:

Code: Select all

#tabbrowser-tabs {
  min-height: 0px !important;
}
#tabbrowser-tabs tab {
  min-height: 0px !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  visibility: collapse !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
  visibility: collapse !important;
}
morat
Posts: 6421
Joined: February 3rd, 2009, 6:29 pm

Re: Hide single tabs in userchrome.css in Firefox version 10

Post by morat »

It works I guess, but I didn't compare the style between Fx 102 and Fx 103.

All the selectors work when I use background-color as a test.

For example:

Code: Select all

#tabbrowser-tabs {
  background-color: lime !important;
}
#tabbrowser-tabs tab {
  background-color: pink !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  background-color: orange !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
  background-color: cyan !important;
}
Also, I don't understand the following entry.

Code: Select all

#tabbrowser-tabs {
  -–tab-min-height: 0px;
}
The --tab-min-height variable is defined on the :root pseudo-class in the source. I never try to redefine a variable like that.

Using CSS variables
http://developer.mozilla.org/docs/Web/C ... properties
Post Reply