CSS to show close tab button when mouse hover a tab
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.
Modified by Testxxxx1234
Chosen solution
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;
}Read this answer in context 👍 2
All Replies (1)
Chosen Solution
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;
}