Skip to content

Instantly share code, notes, and snippets.

@bramus
Created December 2, 2010 00:12
Show Gist options
  • Save bramus/724503 to your computer and use it in GitHub Desktop.
Save bramus/724503 to your computer and use it in GitHub Desktop.
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