Firefox CSS Trapezförmige Tabs: arrowscrollbox wird zu früh angezeigt

[birdskywinter]

Hallo,

ich verwende dieses Script um Trapezförmige Tabs zu erzeugen (wie beim alten google chrome design)

/*maximale Tab Breite festlegen*/
    .tabbrowser-tab[fadein]:not([pinned]) {
    max-width: 200px !important;
    }

  .titlebar-spacer {
    display: none !important;
}

#tabbrowser-tabs {
  /*max-height:22px !important;*/
  margin-left:-1px !important;
  /*margin-top:10px;*/
  border:0px !important;

}

/* Vertikale 1px Linie vor erstem Tab entfernen*/
    .titlebar-placeholder {
    border: none !important;
    }

/*Veritkale 1px Linie Hinter Tabs entfernen*/
    .tabbrowser-tab::before,.tabbrowser-tab::after {
    border: none !important;
    }

/*remove top line of active tab*/
    .tab-line {
    display: none !important;
    }


/*Tabs aussehen*/
    .tab-background {
    /*workaround für verpixelte Tabkanten*/
        outline: 1px solid transparent;
       

    /*Tabform erzeugen */
        -moz-transform: perspective(100px) rotateX(30deg) !important;
        /*width:90% !important;*/

    /*Hintergrundfarbe inaktiver Tab*/
        background-color:#cfcfcf;
 
    /*Border um Tabs*/
        border:2px solid /*#9b9b9b*/ /*#525252*/ #2eb9ce !important;
 
    /*untere Tab Border entfernen*/
        border-bottom:0px solid #2eb9ce !important;
}

/* Change tab load animation to spinning wheel */
    .tab-throbber[busy]::before {
    background-image: url("chrome://global/skin/icons/loading.png") !important;
    animation: unset !important;
    }
    .tab-throbber[busy]:not([progress])::before {
    /* Grays the blue during "Connecting" state */
    filter: grayscale(100%);
    }
    @media (min-resolution: 2dppx) {
    .tab-throbber[busy]::before {
    background-image: url("chrome://global/skin/icons/loading@2x.png") !important;
    }
    }
   
/*/_________TAB_OVERFLOW_FIX________/*/



/* Gleicher Abstand zum ersten Tab wenn Firefox maximiert ist */
    #main-window[sizemode="maximized"] .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
    padding-left: 48px !important;
    }

.tab-loading-burst[bursting]::before {
  animation: unset !important;
}



.tabbrowser-arrowscrollbox {
    overflow: hidden;
}

Nur leider wird dann die arrowscrollbox viel zu früh angezeigt und nicht erst wenn sehr viele Tabs offen sind (im Screenshot sind nur 6 Tabs offen). Hat jemand eine Idee wie man das beheben kann?

 

[2002Andreas]

Wenn ich oben die Breite auf 100px verändere:

/*maximale Tab Breite festlegen*/
    .tabbrowser-tab[fadein]:not([pinned]) {
    max-width: 100px !important;
    }

Dann passen hier 14 Tabs nebeneinander.

 

[birdskywinter]

Das ist ja nun am Sinn des ganzen vorbei.
Das Problem ist das die Skalierung nicht richtig funktioniert.