Help me with the issue of displaying only the icon of the tab being dragged from icon_only_tabs.css.

[BoscoFZ]

I apologize for modifying your icon_only_tabs.css code to the following:

`/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/icon_only_tabs.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

.tabbrowser-tab .tab-label,
.tabbrowser-tab .tab-close-button {
  display: none !important;
}

.tabbrowser-tab[pinned] .tab-label {
  margin-left: 5.5px !important;
}

#TabsToolbar .tabbrowser-tab:hover:not([selected]) {
  min-width: 150px !important;
}

.tabbrowser-tab[selected="true"] {
  min-width: 240px !important;
}

.tabbrowser-tab[selected="true"] .tab-label,
.tabbrowser-tab[selected="true"] .tab-close-button,  #TabsToolbar .tabbrowser-tab:hover:not([selected]) .tab-label,  #TabsToolbar .tabbrowser-tab:hover:not([selected]) .tab-close-button {
  display: block !important;
}

.tab-icon-image:not([src]) {
  display: block !important;
}

.tabbrowser-tab {
  flex-grow: 0 !important;
}

.tabbrowser-tab:not([selected="true"])[fadein] { 
  min-width: calc(16px + 2 * 10px + 4px) !important; 
}

:root[uidensity="compact"] .tabbrowser-tab:not([selected="true"])[fadein] { 
  min-width: calc(16px + 2 * var(--inline-tab-padding,0px) + 4px) !important;   
}

:root:not([uidensity="compact"]) .tab-content { 
  padding-inline: 10px !important;
}

.tabbrowser-tab {
  filter: grayscale(70%);
  transition: filter 0.2s ease-in;
  opacity: 0.5;
}

.tabbrowser-tab[selected="true"], .tabbrowser-tab[pinned], .tabbrowser-tab[soundplaying]  {
  opacity: 1;
}`

Currently, I have an issue when I drag a tab to move it; is there a way to make only the icon of that tab visible? Right now, it's displaying the icon, label, and close button with a length of 240px. If possible, could you help me adjust the code above? Or if you think your original code can address the additional cases that my code is handling, could you assist in modifying your code to include those cases as well? That would be great. Thank you very much.

[MrOtherGuy]

I'm really not sure I understand what you are going for, but I'm guessing it could be this:

#tabbrowser-tabs[movingtab] .tabbrowser-tab{
  min-width: calc(16px + 2 * 10px + 4px) !important; 
}

[BoscoFZ]

Thank you for your help! With the code you just provided, it’s working exactly as I wanted.