search

piroor / treestyletab

Tree Style Tab, Show tabs like a tree.
http://piro.sakura.ne.jp/xul/treestyletab/
Other
3.46k stars 277 forks source link

Icons of pinned tabs are misplaced #933

Closed Grief closed 8 years ago

Grief commented 9 years ago

icons_issue

Grief commented 8 years ago

I missed the obvious thing - it's the conflict with FT DeepDark theme (https://addons.mozilla.org/ru/firefox/addon/ft-deepdark/)

dowiew commented 8 years ago

I confirm the issue. My icons are even more misplaced! But I don't use any theme, just the default. If I un-pin the tabs, restart, pin again, they are aligned. For some time only though. Today they are messed up again.

piroor commented 8 years ago

Which platform, and which theme of TST's "appearance" pane?

dowiew commented 8 years ago

Windows 8.1, FF 40.0.2, left side Mix, Retro Style. No matter which style, I mean I have misplaced icons right now after FF restart and they look bad regardless the theme when I switch it on the fly. The only thing that helps is to unpin all of them, restart FF, and pin again.

piroor commented 8 years ago

@dowiew I couldn't reproduce this problem on Windows 8.1, Firefox 41.0.1, TST latest development build, with same options of TST appearance. Could you upload any screenshot?

piroor commented 8 years ago

I need the inspected result of a misplaced favicon. https://developer.mozilla.org/en-US/docs/Tools/Browser_Toolbox

  1. Start "Browser Toolbox"
  2. Switch to the "Inspector" tab
  3. Click the top-left corner icon. screenshot from 2015-10-02 19 03 21
  4. After the button turns to blue, click a misplaced favicon of a pinned tab.
  5. Then the inspected result is shown in the Browser Toolbox window. The clicked node is highlighted at the leftside pane, and all applied style rules are shown in the rightside pane.
  6. Right-click on the rightside pane, choose "Select All", right-click again, and choose "Copy". Then all style rules are copied to the clipboard.

I hope to know what styles are applied to all nodes related to a misplaced favicon:

Grief commented 8 years ago 
<xul:image xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xbl:inherits="src=image,fadein,pinned,selected,visuallyselected,busy,crashed" xmlns:xbl="http://www.mozilla.org/xbl" anonid="tab-icon-image" class="tab-icon-image" validate="never" role="presentation" fadein="true" ordinal="400" style="" pinned="true" src="http://vk.com/images/faviconnew.ico?3#-moz-resolution=16,16"/>
элемент {
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tab-content[pinned="true"] > image {
    height: 16px;
    margin: 0px;
    padding: 0px;
    width: 16px;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tab-icon-image, .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tab-throbber {
    margin-left: 0px;
}
.tab-icon-image {
    list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}
.tab-throbber, .tab-icon-image {
    height: 16px;
    width: 16px;
}
:-moz-devtools-highlighted {
    outline: 2px dashed #F06 !important;
    outline-offset: -2px !important;
}
image {
    -moz-binding: url("chrome://global/content/bindings/general.xml#image");
}
* {
    -moz-user-focus: ignore;
    -moz-user-select: none;
    display: -moz-box;
    box-sizing: border-box;
}
#TabsToolbar:not(:-moz-lwtheme):not([treestyletab-tabbar-position="top"]) #tabbrowser-tabs .tabbrowser-tab:not([visuallyselected]) {
    color: #555 !important;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab, .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[visuallyselected="true"], .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([visuallyselected="true"]) {
    color: #555 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned] {
    line-height: 0;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    text-align: start !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    line-height: 1;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab {
    pointer-events: auto;
}
.tabbrowser-tab:hover, .tabs-newtab-button:hover {
    color: #00ADEE !important;
    text-shadow: 0px 0px 5px rgba(0, 173, 238, 0.75);
}
.tabbrowser-tab {
    pointer-events: none;
}
.tabbrowser-tab, .tabs-newtab-button {
    color: #A6A6A6 !important;
}
tab:hover {
    color: #FFF;
}
tab {
    color: #A6A6A6;
}
.treestyletab-tabbar-toolbar:not([treestyletab-tabbar-position="top"]), .treestyletab-tabbar-toolbar[treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) {
    line-height: 0 !important;
}
:root {
    --panel-ui-exit-subview-gutter-width: 38px;
}
:root {
    font: message-box;
}
:root {
    --panelui-subview-transition-duration: 150ms;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
:root {
    text-rendering: optimizelegibility;
    -moz-control-character-visibility: visible;
}
<xul:hbox xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xbl:inherits="pinned,selected,visuallyselected,titlechanged" xmlns:xbl="http://www.mozilla.org/xbl" class="tab-content" align="center" pinned="true">

элемент {
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tab-content[pinned="true"] {
    padding: 0px 4px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned="true"] .tab-stack, .tabbrowser-tabs[treestyletab-mode="vertical"] .tab-content[pinned="true"] {
    -moz-box-align: center;
    -moz-box-pack: center;
    min-height: 0px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tab-content {
    margin-left: 0px !important;
    margin-right: 0px !important;
}
.tab-content {
    -moz-padding-start: 5px;
    -moz-padding-end: 5px;
    margin-top: -1px;
}
:-moz-devtools-highlighted {
    outline: 2px dashed #F06 !important;
    outline-offset: -2px !important;
}
* {
    -moz-user-focus: ignore;
    -moz-user-select: none;
    display: -moz-box;
    box-sizing: border-box;
}
#TabsToolbar:not(:-moz-lwtheme):not([treestyletab-tabbar-position="top"]) #tabbrowser-tabs .tabbrowser-tab:not([visuallyselected]) {
    color: #555 !important;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab, .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[visuallyselected="true"], .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([visuallyselected="true"]) {
    color: #555 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned] {
    line-height: 0;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    text-align: start !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    line-height: 1;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab {
    pointer-events: auto;
}
.tabbrowser-tab {
    pointer-events: none;
}
.tabbrowser-tab, .tabs-newtab-button {
    color: #A6A6A6 !important;
}
tab {
    color: #A6A6A6;
}
.treestyletab-tabbar-toolbar:not([treestyletab-tabbar-position="top"]), .treestyletab-tabbar-toolbar[treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) {
    line-height: 0 !important;
}
:root {
    --panel-ui-exit-subview-gutter-width: 38px;
}
:root {
    font: message-box;
}
:root {
    --panelui-subview-transition-duration: 150ms;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
:root {
    text-rendering: optimizelegibility;
    -moz-control-character-visibility: visible;
}
<xul:stack xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" class="tab-stack" flex="1">

элемент {
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned="true"] .tab-stack, .tabbrowser-tabs[treestyletab-mode="vertical"] .tab-content[pinned="true"] {
    -moz-box-align: center;
    -moz-box-pack: center;
    min-height: 0px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned="true"] .tab-stack {
    height: 100%;
    width: 100%;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tab-stack {
    max-height: 999999px;
    min-height: 22px;
}
.tab-stack {
    vertical-align: top;
}
:-moz-devtools-highlighted {
    outline: 2px dashed #F06 !important;
    outline-offset: -2px !important;
}
stack, bulletinboard {
    display: -moz-stack;
}
* {
    -moz-user-focus: ignore;
    -moz-user-select: none;
    display: -moz-box;
    box-sizing: border-box;
}
#TabsToolbar:not(:-moz-lwtheme):not([treestyletab-tabbar-position="top"]) #tabbrowser-tabs .tabbrowser-tab:not([visuallyselected]) {
    color: #555 !important;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab, .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[visuallyselected="true"], .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([visuallyselected="true"]) {
    color: #555 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned] {
    line-height: 0;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    text-align: start !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    line-height: 1;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab {
    pointer-events: auto;
}
.tabbrowser-tab {
    pointer-events: none;
}
.tabbrowser-tab, .tabs-newtab-button {
    color: #A6A6A6 !important;
}
tab {
    color: #A6A6A6;
}
.treestyletab-tabbar-toolbar:not([treestyletab-tabbar-position="top"]), .treestyletab-tabbar-toolbar[treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) {
    line-height: 0 !important;
}
:root {
    --panel-ui-exit-subview-gutter-width: 38px;
}
:root {
    font: message-box;
}
:root {
    --panelui-subview-transition-duration: 150ms;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
:root {
    text-rendering: optimizelegibility;
    -moz-control-character-visibility: visible;
}
<tab xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" class="tabbrowser-tab treestyletab-faviconized" fadein="true" context="tabContextMenu" closetabtext="Закрыть вкладку" linkedpanel="panel-3-1" first-tab="true" label="(3) Новости" visibleLabel="(3) Новости" crop="end" onerror="this.removeAttribute('image');" treestyletab-allow-subtree-collapse="true" align="stretch" maxwidth="65000" minwidth="0" dir="ltr" style="margin-left: 0px ! important; width: 27px; max-width: 27px; left: 1676px; right: auto; margin-top: -27px ! important;" pinned="true" treestyletab-insert-before="tab-&lt;1443190232587-32641&gt;" image="http://vk.com/images/faviconnew.ico?3#-moz-resolution=16,16" treestyletab-id="tab-&lt;1443167614726-31077&gt;" treestyletab-nest="0" first-visible-tab="true" titlechanged="true"/>

элемент {
    margin-left: 0px !important;
    width: 27px;
    max-width: 27px;
    left: 1676px;
    right: auto;
    margin-top: -27px !important;
}
#TabsToolbar:not(:-moz-lwtheme):not([treestyletab-tabbar-position="top"]) #tabbrowser-tabs .tabbrowser-tab:not([visuallyselected]) {
    color: #555 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned][titlechanged]:not([visuallyselected="true"]) {
    background-image: radial-gradient(circle farthest-corner at 50% 3px , #FFF 3%, #569BE4 80%);
}
.tabbrowser-tabs[treestyletab-animation-enabled="true"][treestyletab-mode="vertical"] .tabbrowser-tab:not([treestyletab-collapsed-done="true"]) {
    transition: margin-left 0.2s ease-out 0s, margin-right 0.2s ease-out 0s, margin-top 0.15s ease-out 0s, opacity 0.15s ease-out 0s, min-height 0.15s ease-out 0s, max-height 0.15s ease-out 0s, min-width 0.15s ease-out 0s, max-width 0.15s ease-out 0s;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([visuallyselected="true"]), .tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([visuallyselected="true"]) {
    -moz-border-left-colors: transparent transparent !important;
    -moz-border-right-colors: transparent transparent !important;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([visuallyselected="true"]) {
    -moz-border-top-colors: transparent transparent !important;
    -moz-border-bottom-colors: transparent transparent !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab, .tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[visuallyselected="true"], .tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab:not([visuallyselected="true"]) {
    border-left: 2px solid !important;
    -moz-border-left-colors: #EEE transparent !important;
    border-right: 2px solid !important;
    -moz-border-right-colors: #EEE transparent !important;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab, .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[visuallyselected="true"], .tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([visuallyselected="true"]) {
    -moz-appearance: none !important;
    min-height: 2em;
    margin: 0px !important;
    color: #555 !important;
    background-origin: border-box !important;
    background-position: 0px 0px !important;
    border-top: 2px solid !important;
    -moz-border-top-colors: transparent transparent !important;
    border-bottom: 2px solid !important;
    -moz-border-bottom-colors: #A7A7A7 transparent !important;
    border-radius: 0px !important;
    border-image: none !important;
    -moz-box-align: stretch !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned="true"] {
    height: 24px;
    margin: 0px;
    max-height: 24px;
    max-width: 24px;
    padding: 0px;
    width: 24px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab:not([visuallyselected="true"]), .tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[visuallyselected="true"] {
    z-index: auto;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab[pinned] {
    line-height: 0;
    position: fixed !important;
    z-index: 100;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    -moz-box-pack: start !important;
    text-align: start !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab {
    line-height: 1;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab {
    pointer-events: auto;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tab, toolbar.treestyletab-tabbar-toolbar[treestyletab-mode="vertical"] > toolbarbutton, toolbar.treestyletab-tabbar-toolbar[treestyletab-mode="vertical"] > .treestyletab-toolbar-inner-box > toolbarbutton, toolbar.treestyletab-tabbar-toolbar[treestyletab-mode="vertical"] > toolbaritem, toolbar.treestyletab-tabbar-toolbar[treestyletab-mode="vertical"] > .treestyletab-toolbar-inner-box > toolbaritem {
    -moz-box-flex: 0 !important;
}
.tabbrowser-tab {
    pointer-events: none;
}
.tabbrowser-tab {
    -moz-box-align: stretch;
}
.tabbrowser-tab, .tabs-newtab-button {
    -moz-appearance: none;
    background: transparent linear-gradient(#282828 35%, #212121 95%) no-repeat scroll 0% 0% / 200% auto border-box;
    height: 25px;
    border-radius: 0px;
    margin: 0px;
    padding: 0px;
    color: #A6A6A6 !important;
    box-shadow: 0px 1px rgba(255, 255, 255, 0.02) inset;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    border-left: 1px solid #000;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    border-bottom: 0px none !important;
}
.tabbrowser-tab {
    -moz-binding: url("chrome://browser/content/tabbrowser.xml#tabbrowser-tab");
}
tab {
    -moz-appearance: none;
    margin-top: 2px;
    border-radius: 0px;
    padding: 1px 4px 2px;
    background: transparent linear-gradient(#464646, #282828) repeat scroll 0% 0%;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    border-left: 1px solid #000;
    color: #A6A6A6;
}
:-moz-devtools-highlighted {
    outline: 2px dashed #F06 !important;
    outline-offset: -2px !important;
}
tab {
    -moz-binding: url("chrome://global/content/bindings/tabbox.xml#tab");
    -moz-box-align: center;
    -moz-box-pack: center;
}
* {
    -moz-user-focus: ignore;
    -moz-user-select: none;
    display: -moz-box;
    box-sizing: border-box;
}
.treestyletab-tabbar-toolbar:not([treestyletab-tabbar-position="top"]), .treestyletab-tabbar-toolbar[treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) {
    line-height: 0 !important;
}
:root {
    --panel-ui-exit-subview-gutter-width: 38px;
}
:root {
    font: message-box;
}
:root {
    --panelui-subview-transition-duration: 150ms;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
window, page, dialog, wizard, prefwindow {
    color: #A6A6A6;
    font: message-box;
}
window {
    font: 3mm tahoma,arial,helvetica,sans-serif;
}
:root {
    text-rendering: optimizelegibility;
    -moz-control-character-visibility: visible;
}
dowiew commented 8 years ago

@piroor - I have to put my desktop machine into sleep instead of shutdown just not to restart Firefox and have the icons properly placed once I organize them. To complete your request I restarted FF 3 times (the icons not always get misplaced) and got them like this, on the screenshot. screen And here are the pasted styles of the 1st and 2nd icon (only 1 difference for the 3rd one - margin-left: 48px instead of 24px). I can not include more files here for some reason, so here are the links to pastebin http://pastebin.com/stJgSSBy http://pastebin.com/guRpNkSR

piroor commented 8 years ago

@dowiew The navigation toolbar in your screenshot seems very narrow. Any theme or custom rules in userChrome.css? TST is designed to work with default Firefox theme with no modification by userChrome.css.

piroor commented 8 years ago

@Grief Thanks, TST's style rules seems to conflict with the one of the theme itself. Could you try to put following style rules to your userChrome.css?

.tabbrowser-tabs[treestyletab-mode="vertical"]
  .tabbrowser-tab:not([busy]):not(:hover)
  .tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
  .tabbrowser-tab:not([busy]):hover
  .tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
  .tabbrowser-tab:not([busy]):not(:hover)
  .tab-content[pinned][visuallyselected="true"],
.tabbrowser-tabs[treestyletab-mode="vertical"]
  .tabbrowser-tab:not([busy]):hover
  .tab-content[pinned][visuallyselected="true"] {
    padding-left: 10px /* change the value as you like. */ !important;
}
piroor commented 8 years ago

Anyway, TST just supports the default theme of Firefox itself because it is impossible to design TST to work with various custom theme or unknown userChrome.css rules. I think this is an unavoidable limitation of addons which is developed by an individual author.

dowiew commented 8 years ago

@piroor Indeed, the userChrome.css contained a few lines and I noticed a style addon called 'Minimal for Australis' which claims to interfere with UI. I reverted userChrome.css to default, disabled the style addon, made sure only default theme, restarted - no change, the icons are still misplaced... I have noticed that after FF starts with no pinned tabs and I start pinning them, the icons seem to be placed a few pixels to the left right away: ekran 2015-10-05 12-44-45 When I restart FF I get them moved to the left much more (like previous screenshot) but the Browser Toolbox style rules are almost exactly the same (at the beginning, the margin-left: line is placed after max-width: line: element { margin-left: 0px !important; width: 24px; max-width: 24px; ) Oh well, I've been using my current addons set, including TST for a very long time and was happy but now I am annoyed. Can my other addons interfere? Should I start disabling them one by one? Is there any chance TST will work well?

Grief commented 8 years ago

@piroor The userChrome.css rules you've provided didn't fix the issue unfortunately