Hi, By default, I set the tab-close-button always visible, to use it like a tab-separator, but I would like to remove the tab-close-button when the tab gets smaller than some specific size. For example, in the image I attached, I would like to remove the close button but when the tab gets a little bigger the close button should appear. I used this code to make the tabs smaller that default:

.tabbrowser-tab {
      &:not([pinned]) {
        #tabbrowser-tabs[orient="horizontal"] &[fadein] {
          --tab-min-width-pref: calc(16px + 2 * 10px + 2px) !important; !important;
          --tab-min-width: var(--tab-min-width-pref) !important;
        }
      }
    }

So, It is possible to remove the close button when the tab size is smaller than 50px or something like that?

  • Godie@lemmy.worldOP
    1·
    4 months ago

    Wow, I don’t know how it works but works, I will research ‘CSS container’, to learn. I appreciate your help. 💙

    • MrOtherGuy@lemmy.worldM
      2·
      4 months ago

      Yeah, so I haven’t actually come across very many situations where containers or container queries are useful (in the context of Firefox UI) but in this specific case they actually solve the issue perfectly.