Windows 10 will reach EOS (end of support) on October 14, 2025. For more information, see this article.

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

A close button on the left of each tab

more options

I prefer the button on the left of each tab – as shown in the two tabs in the screenshot at https://files.gitter.im/gitterHQ/gitter/1qgz/learn.png

How can I achieve that, without an add-on?

I previously used Classic Theme Restorer, the relevant preference was probably `extensions.classicthemerestorer.closeonleft`

I prefer the button on the left of each tab – as shown in the two tabs in the screenshot at https://files.gitter.im/gitterHQ/gitter/1qgz/learn.png How can I achieve that, without an add-on? I previously used Classic Theme Restorer, the relevant preference was probably `extensions.classicthemerestorer.closeonleft`

Chosen solution

I don't think there is any built-in setting for that.

Many aspects of the interface can be modified using a custom style rule. This is based on an old mozillaZine post. I updated it for the Firefox 53 layout on Windows 7, which hopefully does not diverge too much from yours.

.tabbrowser-tab .tab-throbber,
.tabbrowser-tab .tab-icon-image,
.tabbrowser-tab .tab-sharing-icon-overlay,
.tabbrowser-tab .tab-icon-overlay,
.tabbrowser-tab .tab-label-container,
.tabbrowser-tab .tab-icon-sound {
  -moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab .tab-close-button {
  margin-left: -2px !important;
  margin-right: 2px !important;
}

Illustrative screen shot attached.

I tested that using the Stylish extension (new blank style > paste), but if you are not interested in another extension, it also can be applied using a userChrome.css file.

Read this answer in context 👍 1

All Replies (3)

more options

Chosen Solution

I don't think there is any built-in setting for that.

Many aspects of the interface can be modified using a custom style rule. This is based on an old mozillaZine post. I updated it for the Firefox 53 layout on Windows 7, which hopefully does not diverge too much from yours.

.tabbrowser-tab .tab-throbber,
.tabbrowser-tab .tab-icon-image,
.tabbrowser-tab .tab-sharing-icon-overlay,
.tabbrowser-tab .tab-icon-overlay,
.tabbrowser-tab .tab-label-container,
.tabbrowser-tab .tab-icon-sound {
  -moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab .tab-close-button {
  margin-left: -2px !important;
  margin-right: 2px !important;
}

Illustrative screen shot attached.

I tested that using the Stylish extension (new blank style > paste), but if you are not interested in another extension, it also can be applied using a userChrome.css file.

more options

Note that current Firefox releases support -moz-box-ordinal-group:0 and that makes it easier to move one element to the fare left by giving it this property.

why put the x next to the new tab button, why? https://support.mozilla.org/en-US/questions/1149605

.tabbrowser-tab .tab-close-button {
display:-moz-box!important;
-moz-box-ordinal-group:0!important;
margin-right:3px!important;
}

(you may want to add a margin-left property)

Modified by cor-el

more options

Thank you both!

Much better now, as shown in the first of the two shots with this post (2017-04-23 07-23.png).

Also, I took the opportunity to set a greater minimum width for tabs. At first I guessed, no narrower than is shown in the second shot (2017-04-23 07-28.png), then – better than guessing – in about:config, from before I disabled Classic Theme Restorer, I found:

extensions.classicthemerestorer.ctabmwidth 125 extensions.classicthemerestorer.ctabwidth 300

Ultimately I chose a minimum width of 175.

Stylish was already installed (visible in the shot that's linked from my opening post). I took the userChrome.css approach to get things as required, at a first computer, before aiming to apply things elsewhere.

Modified by Graham Perrin