How to get rid of Add new tab button' square

[delicacy1]

I'd like to get rid of the add tab button' square that wraps the cross with a css.

[TheVisitor]

Open customize and drag it to the pallet

[delicacy1]

You're giving super powers to the customize window Visitor ))
You can't drag such part of an element. if you drag the button the square follows ))

[malliz]

If you remove the active area square the add new tab button will cease to work

[dickvl]

Can you post a screenshot to show what you are talking about?

Note that the new tab button looks different if you move this button from the Tab bar to another toolbar.
There are also two such buttons, the first is removable and shows at the far right with the Tab bar filled and the second is the one you see next to last tab.
#new-tab-button {}
.tabs-newtab-button {}

See chrome://browser/skin/browser.css

Code: Select all

/* Tabstrip new tab button */
.tabs-newtab-button,
#TabsToolbar > #new-tab-button ,
#TabsToolbar > toolbarpaletteitem > #new-tab-button {
  list-style-image: url(chrome://browser/skin/tabbrowser/newtab.svg);
  -moz-image-region: auto;
}

[delicacy1]

It didn't work, note: i'm using the ctr addon.

This is the square that wraps the cross of the "add new tab" icon:

[flaneurb]

Do you want something like this?
https://imgur.com/a/8jHTz

[delicacy1]

Yes flaneur

[flaneurb]

I'm on Linux and using Firefox 57 and so no more CTR:( I didn't set out especially to make the box disappear. So I'm not sure I can help. But it's possible that people may now be able to help you once it's clear what you want. All the best.

[dickvl]

I only see this with tabs_squared selected.
See:
chrome://classic_theme_restorer/content/css/tabs_squared.css
I can't override this with userChrome.css probably because CTR uses the important flag, so you will have to select one of the other Tab appearance choices.

Code: Select all

.tabs-newtab-button:not(:-moz-lwtheme){
  border-width: 5px 3px 6px !important;
  border-image: url(chrome://classic_theme_restorer/content/images/tab.png) 5 3 6 fill repeat round !important;
  border-style: solid !important;
}

This doesn't work for me (I see the rules in the DOMi), but below the CTR settings.

Code: Select all

.tabs-newtab-button:not(:-moz-lwtheme) {
  background:none!important;
  border:0px!important;
}

[delicacy1]

none work

[Brummelchen]

firefox 44 has round tabs also for new tab - no sqare possible

.tabs-newtab-button:not(:-moz-lwtheme) {
background:none!important;
border:0px!important;
}

working. and dont disables the functionality but the hover is also not visible.

if dont work its messed up with something else we dont know

[Reflective]

Slightly different wording in this css suggestion: https://support.mozilla.org/en-US/questions/762678

If it doesn't work disable CTR. If it works after doing that, then you know what the problem is.

[delicacy1]

i already mentioned using ctr & have no intention in disabling it, if i liked the space-like tab shapes of ff44, i wouldn't have applied a theme on it through ctr,
my hard task's now to find out which css with the ctr prefix in the code does it, as already suggested dickvl.

[delicacy1]

I'm on the ctr squared tab australis v2.