Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Natao arisiva ity resaka mitohy ity. Mametraha fanontaniana azafady raha mila fanampiana.

CSS to show close tab button when mouse hover a tab

  • 1 valiny
  • 0 manana an'ity olana ity
  • 1 view
  • Valiny farany nomen'i cor-el

Testxxxx1234
Testxxxx1234
more options

Currently I'm using the css from this thread https://support.mozilla.org/en-US/questions/1341968 Now with firefox 113, this no longer works, I'm hoping someone can help me with this.

Currently I'm using the css from this thread [https://support.mozilla.org/en-US/questions/1341968 https://support.mozilla.org/en-US/questions/1341968] Now with firefox 113, this no longer works, I'm hoping someone can help me with this.

Novain'i Testxxxx1234 t@

Vahaolana nofidina

I currently use this code to always hide all close button and show them on hover after a short delay to prevent closing a tab when selecting it. 

/* TAB: close button colors on hover */
.tab-close-button:hover {
  background-color: rgba(255,0,0,.7) !important;
  fill: white !important;
}

.tabbrowser-tab:not([pinned]) .tab-close-button {
  display: inline-flex !important;
}

.tabbrowser-tab:not([pinned]) .tab-close-button {
  max-width: 0 !important;
  transition: all 100ms ease-in-out 100ms;
}

/* close button shown on hover */
 .tabbrowser-tab:not([pinned]):hover .tab-close-button {
  max-width: 20px !important;
  transition: all 250ms ease-in-out 800ms;
}

Hamaky an'ity valiny ity @ sehatra 👍 2

All Replies (1)

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Vahaolana Nofidina

I currently use this code to always hide all close button and show them on hover after a short delay to prevent closing a tab when selecting it. 

/* TAB: close button colors on hover */
.tab-close-button:hover {
  background-color: rgba(255,0,0,.7) !important;
  fill: white !important;
}

.tabbrowser-tab:not([pinned]) .tab-close-button {
  display: inline-flex !important;
}

.tabbrowser-tab:not([pinned]) .tab-close-button {
  max-width: 0 !important;
  transition: all 100ms ease-in-out 100ms;
}

/* close button shown on hover */
 .tabbrowser-tab:not([pinned]):hover .tab-close-button {
  max-width: 20px !important;
  transition: all 250ms ease-in-out 800ms;
}