Tab maximum width

[Vhin]

I'm using 64-bit Firefox on Windows 8.1.

I'm attempting to set a maximum width for tabs, and I'm having a weird issue.

This is what my userChrome.css looks like:

Code: Select all

@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

.tabbrowser-tab:not([pinned]) {
    max-width: 200px !important;
}

The weirdness is that now, closing a tab doesn't shift the other tabs. It's sort of like a hole in the tab bar. I can't describe it particularly well, so here's a couple screenshots showing it:

Before: http://imgur.com/LWMIIkq
After: http://imgur.com/Up2fjOv

Tabs to the right of the closed tab don't shift left to fill in the space, and I can't manually move a tab there either. It's

If I comment out the max-width in user-chrome.css, it works correctly. I'm not experiencing this issue in the x86 version of Firefox. I've already tried disabling all my extensions. The problem doesn't happen in safe mode, but I think that's just because safe mode doesn't read userChrome.css.

I started to file a bug report with bugzilla, but I was having a lot of problems describing the problem clearly with just text, so I decided to post here first. If anyone has any idea of a workaround (maybe I'm just doing something wrong with userChrome), I'd appreciate it.

[Aris]

Tab width changes do not work properly, if you apply them through userChrome.css, userContent.css, Stylish or a simple css loader. The only way without breaking automatic space removal between tabs is using proper style injection into browsers default css files "on the fly" (e.g. into browser.css). This is how tab width changes work in Classic Theme Restorer, TabMixPlus and TabUtilities.
Believe me there is no "easy" way around this without breaking things.

You have to use JavaScript and something like:

Code: Select all

var ruleEndPosition = document.styleSheets[1].cssRules.length;
document.styleSheets[1].cssRules[document.styleSheets[1].insertRule('.tabbrowser-tab:not([pinned]){}', ruleEndPosition)];
document.styleSheets[1].cssRules[ruleEndPosition].style.maxWidth="200px";

[Reflective]

Download Classic Theme Restorer and then adjust your tabs in the Tabs menu. Here's a screenshot: https://i.imgsafe.org/026d15f791.png

[LIMPET235]

If you get stuck, this extension works with both Min & Max widths...
Why not try...
> https://addons.mozilla.org/en-US/firefo ... th/?src=ss

[Vhin]

Sorry for not responding quickly. I've been busy the past couple of days.

If you get stuck, this extension works with both Min & Max widths...
Why not try...
> https://addons.mozilla.org/en-US/firefo ... th/?src=ss

I already tried it. It disables e10s, so I'd rather not use it if possible.

Download Classic Theme Restorer and then adjust your tabs in the Tabs menu. Here's a screenshot: https://i.imgsafe.org/026d15f791.png

CTR won't work starting in Firefox 57. I've used it before and really like it, but I actually uninstalled it recently (along with Tab Mix Plus, which is in the same boat), because I don't want to rely on addons that will stop working in a few months.

Tab width changes do not work properly, if you apply them through userChrome.css, userContent.css, Stylish or a simple css loader. The only way without breaking automatic space removal between tabs is using proper style injection into browsers default css files "on the fly" (e.g. into browser.css). This is how tab width changes work in Classic Theme Restorer, TabMixPlus and TabUtilities.
Believe me there is no "easy" way around this without breaking things.

You have to use JavaScript and something like:

Code: Select all

var ruleEndPosition = document.styleSheets[1].cssRules.length;
document.styleSheets[1].cssRules[document.styleSheets[1].insertRule('.tabbrowser-tab:not([pinned]){}', ruleEndPosition)];
document.styleSheets[1].cssRules[ruleEndPosition].style.maxWidth="200px";

Is there any kind of init script file I can put the code in (a la Atom's init.coffee or ~/.zshrc), or would I have to make an extension to to that?

[lovemyfoxy]

I was just thinking that when the extensions die, we can keep you guys busy composing code instead.... constantly...

[LIMPET235]

LMF...^...
or just stay with an earlier version that just works?

[lovemyfoxy]

But then we won't be able to pester you as much.

[Newbie12]

You have to use JavaScript and something like:

Code: Select all

var ruleEndPosition = document.styleSheets[1].cssRules.length;
document.styleSheets[1].cssRules[document.styleSheets[1].insertRule('.tabbrowser-tab:not([pinned]){}', ruleEndPosition)];
document.styleSheets[1].cssRules[ruleEndPosition].style.maxWidth="200px";

Where do I insert this code??

Download Classic Theme Restorer and then adjust your tabs in the Tabs menu. Here's a screenshot: https://i.imgsafe.org/026d15f791.png

dead link....addon removed....

If you get stuck, this extension works with both Min & Max widths...
Why not try...
> https://addons.mozilla.org/en-US/firefo ... th/?src=ss

dead link....addon removed....

LMF...^...
or just stay with an earlier version that just works?

Actually you do need to stay with the times since some sites are broken even with the latested 52.9 ESR.... For example Github edit functions doesn't work in Firefox 52.9 ESR.....nor are you able to login in GoG.com website....but yes stay with the older browsers since there aren't equivalent addons or workarounds that work in then newer quantum browser....

Also do any addons exist to get variable tab widths rather than set width?

[malliz]

Any chance you could look at the date of the original posts? The thread is more than two years old for petes sake

[trolly]

Locking due to age.