Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Mozilla Firefox 4.0 (beta) userChrome.css adjustments to place the close buttons on the left hand side of the tab.
/*
* Do not remove the @namespace line -- it's required for correct functioning
*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
/* move favicon, throbber and text to the right so that the close button appears on the left */
.tabbrowser-tab .tab-icon-image {
-moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab .tab-throbber {
-moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab .tab-label {
-moz-box-ordinal-group: 3 !important;
}
/* hide close button initially */
.tabbrowser-tab .tab-close-button {
display: none !important;
}
/* show close + hide throbber & favicon on hover */
.tabbrowser-tab:hover .tab-close-button {
display: block !important;
}
.tabbrowser-tab:hover .tab-icon-image {
display: none !important;
}
.tabbrowser-tab:hover .tab-throbber {
display: none !important;
}
/* app tabs should not behave like regular tabs, so let them stay normal (viz. don't show close on hover) */
.tabbrowser-tab[pinned]:hover .tab-close-button {
display: none !important;
}
.tabbrowser-tab[pinned]:hover .tab-icon-image {
display: block !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.