Abstand erster Tab (Nightly)

Fox2Fox

Habe einen Abstand des ersten Tabs nach links zur Kante.

Würde gerne den ersten Tab linksbündig ohne Leerraum sehen.

Version: 71.0a1

Build-ID: 20191003214801

Kann man mit diesem vorhandenen CSS korrigieren?

CSS

/*Tab-Aussehen verändern*/

/* Abstand vom letzten Tab der Reihe nach rechts */

#tabbrowser-tabs{
margin-right:-20px!important
}

/* Neuer Tabbutton kleiner und unsichtbar gemacht*/

.tabs-newtab-button, #TabsToolbar > #new-tab-button, #TabsToolbar > toolbarpaletteitem > #new-tab-button {
    visibility:hidden!important;}

/* TAB normal (inaktiv):
 * Hintergrundfarbe, Schriftfarbe,
 * Rahmen um die TABs, oben abgerundet und Abstände angepasst,
 */
 
 #toolbar-menubar:not([autohide=true]) ~ #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab > .tab-stack > .tab-background {
  border:none!important;}
 
#TabsToolbar .tabbrowser-tab {
  color: black !important;
  border: 1px solid !important;
  border-bottom: 1px solid black!important;
  background: #ffffff !important;                  /* weiß für inaktive Tabs*/
  border-radius: 2px 2px 0 0 !important;
  margin: 2px 1px 1px 2px !important;
  padding: 1px 0 !important;
}

/* TAB bei Mauskontakt:
 * Hintergrundfarbe, Rahmen
 */
#TabsToolbar .tabbrowser-tab:hover {
  color: black !important;
}

/* TAB bei bei angewähltem TAB (aktiv):
 * Hintergrundfarbe, Rahmen,
 * Schriftfarbe.
 */
#TabsToolbar .tabbrowser-tab[selected="true"] {
 background: #fe3858 !important; 
  /*font-weight:bold !important;*/
  color: white ! important;
}

#TabsToolbar .tabbrowser-tab * {
  background: none !important;
}

Alles anzeigen

2002Andreas

Das liegt wahrscheinlich an deinem benutzten Code für die Tableiste unten.

Poste den doch bitte mal.

Fox2Fox

Tabs_unten.uc.js

Da sind aber keine Werte enthalten

Code

(function() {
  var tabbar = document.getElementById('TabsToolbar');
  if (tabbar && !tabbar.collapsed) {
    tabbar.parentNode.parentNode.appendChild(tabbar);
  };
})();

Tabs_mehrzeilig.uc.js

Code

// ==UserScript==
// @name           zzzz-MultiRowTab_LiteforFx48.uc.js
// @namespace      http://space.geocities.yahoo.co.jp/gl/alice0775
// @description    Experimentelle CSS Version für Mehrzeilige Tableiste
// @include        main
// @compatibility  Firefox 66
// @author         Alice0775
// @version        2016/08/05 00:00 Firefox 48
// @version        2016/05/01 00:01 hide favicon if busy
// @version        2016/03/09 00:01 Bug 1222490 - Actually remove panorama for Fx45+
// @version        2016/02/09 00:01 workaround css for lwt
// @version        2016/02/09 00:00
// ==/UserScript==
"user strict";
MultiRowTabLiteforFx();
function MultiRowTabLiteforFx() {
    var css =`
    /* Mehrzeilige Tableiste */
    tabs>arrowscrollbox{display:block;}
    tabs arrowscrollbox>scrollbox{display:flex;flex-wrap:wrap;}
    tabs tab[fadein]:not([pinned]){flex-grow:1;}
    tabs tab,.tab-background {
        height: var(--tab-min-height);
        z-index: 1 !important;
    }
    tab>.tab-stack{width:100%;}
    [sizemode="fullscreen"] #TabsToolbar>#window-controls,
    .titlebar-buttonbox-container>.titlebar-buttonbox{display:block;}
    [sizemode="fullscreen"] #TabsToolbar>#window-controls>toolbarbutton {
        padding: 10px 12px !important;
    }
    .titlebar-buttonbox>.titlebar-button {
        padding: 10px 17px !important;
    }
    /* Drag-Bereich auf der linken und rechten Seite der Tab-Leiste auslenden - verstecken,
    bei Bedarf Code aktivieren,:
        Links und rechts → hbox.titlebar-spacer 
        links → hbox.titlebar-spacer [type = "pre-tabs"] 
        rechts → hbox.titlebar-spacer [type = "post-tabs"] */
    hbox.titlebar-spacer,
    /* Ausblenden - verstecken */
    #alltabs-button,tabs [class^="scrollbutton"],tabs spacer,tab:not([fadein]) { display: none; }
    `;
    var sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
    var uri = makeURI('data:text/css;charset=UTF=8,' + encodeURIComponent(css));
    sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
    var style = ' \
    tabs tab:not(stack) { \
        border-left: solid 1px hsla(0,0%,50%,.5) !important; \
        border-right: solid 1px hsla(0,0%,50%,.5) !important; \
    } \
    tabs tab:after,tabs tab:before{display:none!important;} \
    ';
    var sspi = document.createProcessingInstruction('xml-stylesheet',
    'type="text/css" href="data:text/css,' + encodeURIComponent(style) + '"');
    document.insertBefore(sspi, document.documentElement);
    gBrowser.tabContainer._animateTabMove = function(event){}
    gBrowser.tabContainer._finishAnimateTabMove = function(event){}
    gBrowser.tabContainer.lastVisibleTab = function() {
        var tabs = this.children;
        for (let i = tabs.length - 1; i >= 0; i--){
            if (!tabs[i].hasAttribute("hidden"))
                return i;
        }
        return -1;
    };
    gBrowser.tabContainer.clearDropIndicator = function() {
        var tabs = this.children;
        for (let i = 0, len = tabs.length; i < len; i++){
            let tab_s= tabs[i].style;
            tab_s.removeProperty("border-left-color");
            tab_s.removeProperty("border-right-color");
        }
    };
    gBrowser.tabContainer.addEventListener("dragleave",gBrowser.tabContainer.clearDropIndicator, false);
    gBrowser.tabContainer._onDragOver = function(event) {
        event.preventDefault();
        event.stopPropagation();
        this.clearDropIndicator();
        var newIndex = this._getDropIndex(event);
        if (newIndex == null)
            return;
        if (newIndex < this.children.length) {
            this.children[newIndex].style.setProperty("border-left-color","red","important");
        } else {
            newIndex = gBrowser.tabContainer.lastVisibleTab();
            if (newIndex >= 0)
                this.children[newIndex].style.setProperty("border-right-color","red","important");
        }
    };
    gBrowser.tabContainer.addEventListener("dragover", gBrowser.tabContainer._onDragOver, false);
    gBrowser.tabContainer._getDropIndex = function(event, isLink) {
        var tabs = this.children;
        var tab = this._getDragTargetTab(event, isLink);
        if (!RTL_UI) {
            for (let i = tab ? tab._tPos : 0; i < tabs.length; i++)
                if (event.screenX < tabs[i].boxObject.screenX + tabs[i].boxObject.width / 2
                 && event.screenY < tabs[i].boxObject.screenY + tabs[i].boxObject.height) // multirow fix
                
                    return i;
        } else {
            for (let i = tab ? tab._tPos : 0; i < tabs.length; i++)
                if (event.screenX > tabs[i].boxObject.screenX + tabs[i].boxObject.width / 2
                 && event.screenY < tabs[i].boxObject.screenY + tabs[i].boxObject.height) // multirow fix
                    return i;
        }
        return tabs.length;
    };
    gBrowser.tabContainer.onDrop = function(event) {
        this.clearDropIndicator();
        var dt = event.dataTransfer;
        var draggedTab;
        if (dt.mozTypesAt(0)[0] == TAB_DROP_TYPE) {
            draggedTab = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
            if (!draggedTab)
                return;
        }
        this._tabDropIndicator.collapsed = true;
        event.stopPropagation();
        if (draggedTab && draggedTab.parentNode == this) {
            let newIndex = this._getDropIndex(event, false);
            if (newIndex > draggedTab._tPos)
                newIndex--;
            gBrowser.moveTabTo(draggedTab, newIndex);
        }
    };
    gBrowser.tabContainer.addEventListener("drop",gBrowser.tabContainer.onDrop, false);
}

Alles anzeigen

2002Andreas

Teste bitte im CSS Code mit diesem zusätzlichen Eintrag: (Wert evtl. noch anpassen)

CSS

#tabbrowser-tabs{
margin-left:-12px!important
}

Sieht hier dann so aus:

milupo

Das Thema hatten wir schon mal. Leider habe ich bisher nicht gefunden wo.

Fox2Fox

Klappt! Herzlichen Dank!

2002Andreas

Freut mich, war gern geschehen