Höhe der Tabs und der Leiste darunter ändern (inklusive den Symbolen von z.B Addons)

BrokenHeart

Sehe gerade, dass du die Menüleiste nicht aktiviert hast, dann muss der Code nochmal geändert werden. Die Tableiste wird dann nämlich zur Titelleiste mit den entsprechen 'Fensterdekorationen' (Schließen etc.). Die verhindern auch eine minimale Größe. Kann dauern...(oder jemand anderes nimmt sich der Sache an).

Zitat von sotnu

Sorry, ich komme gar nicht mit, mir den code anzuschauen, ich schaffe es gerade so, den code einzufügen und zu testen, bevor eine neue Antwort kommt

Aber die letzte Code-Änderung ist sowieso hinfällig, wenn du die Menüleiste nicht eingeblendet haben möchtest...

sotnu

Das ist kein Problem, ich versuche rumzubasteln, aber ich habe ja keine Ahnung

CSS

.tabbrowser-tab {
    min-height: 24px !important;
    max-height: 24px !important;
}

#nav-bar {
    min-height: 24px !important;
    max-height: 24px !important;
}

#nav-bar .chromeclass-toolbar-additional .toolbarbutton-icon
{
    transform: scale(0.75,0.75) !important;
}

.tabs-newtab-button {
     vertical-align: bottom !important;
     height: 27px;
}

#TabsToolbar { 
     margin-bottom: -5px !important;
}

Alles anzeigen

Ich habe mal etwas rumgespielt und das gemacht (link unten). Ich habe nun keinen schwarzen spalt mehr unter den tabs. Aber dafür oben Wenn ich gleichzeitig margin-bottom und margin-top nutze, verschieben sich nur die 3 Buttons oben rechts (schliessen, minimieren, maximieren) nach oben. Also wenn ich margin-bottom nutze, verschieben sich die 3 Buttons nach unten. Das sieht man aber nur, wenn man mit der Maus drüber fahrt, dann sieht man die transparente Umrandung, die überlappt. Das gleiche bei Margin-top, nur verschieben sich die 3 Buttons nach oben.

Und naja, immerhin konnte ich mit der 2. ändern sehen, was #TabsToolbar ist. Aber ja, ich will nur die beiden Leisten eingeblendet haben, um möglichst wenig Platz zu brauchen. Sowieso danke für die Hilfe bisher!

https://abload.de/img/firefoxtabdnnermache_opkfz.png

sotnu

Ich habe es jetzt ma so hingebastelt. Was noch nicht funktioniert, ist die Symbole zu zentrieren. Das kriege ich gerade nicht hin. Aber ich bin mal müde, mache vlt. mal morgen weiter. (Ergebnis unten im Link)

CSS

.tabbrowser-tab {
    min-height: 23px !important;
    max-height: 23px !important;
}

#nav-bar {
    min-height: 24px !important;
    max-height: 24px !important;
    margin-top: -7px;
}

#nav-bar .chromeclass-toolbar-additional .toolbarbutton-icon
{
    transform: scale(0.75,0.75) !important;
}

.tabs-newtab-button {
     vertical-align: bottom !important;
     height: 22px;
}

#TabsToolbar {
    min-height: 10px !important;
    max-height: 10px !important;
 
}

Alles anzeigen

https://abload.de/img/firefoxtabdnnermache_69juk.png

BrokenHeart

Wie ich sehe, hast du das Problem schon fast selber gelöst.

Ich habe jetzt mal eine Version zusammengebastelt, in der die Größenanpassungen bei eingeblendetem und ausgeblendetem Menü und im Fullscreenmodus (F11) funktionieren sollten. Sicher kann man einige der margin/transform-Regeln auch automatisch in Abhängigkeit der Toolbar-Höhen berechnen lassen, aber das war mir jetzt zu viel Arbeit...also ist bei den Werten Nachjustieren in Handarbeit angesagt.

Die alten Codes bitte nicht mehr verwenden. Da gab es Seiteneffekte in den Dropout-Menüs (verfluchtes 'Shadow-DOM' ).

CSS

:root {
  --tab-height:         20px;
  --navbar-height:        24px;
  --navbar-itemsize:    0.85;
}

:root[tabsintitlebar][sizemode="normal"] #titlebar {
    -moz-appearance: none !important;
}

:root:not([inFullscreen]) #toolbar-menubar[autohide="false"] ~ #TabsToolbar
{
    margin-top: -8px !important;
}

:root[inFullscreen] #minimize-button, 
:root[inFullscreen] #restore-button, 
:root[inFullscreen] #close-button 
{
    transform: translateY(-3px);
}

.titlebar-button
{
    transform: translateY(-3px) scale(1,0.8);
}

.tabbrowser-tab, 
#TabsToolbar, 
#scrollbutton-up,
#scrollbutton-down,
#alltabs-button {
    min-height: var(--tab-height) !important;
    max-height: var(--tab-height) !important;
}

#nav-bar {
    min-height: var(--navbar-height) !important;
    max-height: var(--navbar-height) !important;
}

#nav-bar .chromeclass-toolbar-additional .toolbarbutton-icon {
    transform: scale( var(--navbar-itemsize),var(--navbar-itemsize) ) !important;
    margin-top: -8px !important;
}

Alles anzeigen

sotnu

Noch mal tausend Dank für die Hilfe

Mal eine Zwischenfrage: Wie findest du heraus, wie die Bezeichnungen für die jeweiligen Symbole, Leisten usw. sind? Wie kriegst du da die Namen heraus?

Also deinen aktuellsten code habe ich ausprobiert, leider funktioniert das gar nicht bei mir (es ändert nichts). Ich muss schon die Werte ganz am Anfang bei :root verändern, oder? Das funktioniert bei mir nicht. Das einzige, was funktioniert, ist folgendes (also alles, was nicht mit :root zu tun hat).:

Code

.titlebar-button
{
    transform: translateY(-3px) scale(1,0.8);
}

Ich weiss nicht, warum das so ist.

Aber ich konnte daraus noch 2 Dinge in meine vorherige Bastelei einfügen. Damit kann ich immerhin die Symbole in der Navigationsleiste zentrieren (zumindest bis auf 2 Symbole, die wollen nicht).

CSS

.tabbrowser-tab {
    min-height: 23px !important;
    max-height: 23px !important;
}

#nav-bar {
    min-height: 24px !important;
    max-height: 24px !important;
    margin-top: -8px !important;
}

#nav-bar .chromeclass-toolbar-additional .toolbarbutton-icon
{
    transform: scale(0.5,0.5) !important;
    margin-top: -8px !important;
}

#TabsToolbar {
    min-height: 10px !important;
    max-height: 10px !important;
 }

.titlebar-button {
    transform: translateY(-2px) scale(1,1);
}

Alles anzeigen

Ich habe mal zur Veranschaulichung die Symbole in der Navigationsleiste stark verkleinert und zentriert. Dabei sieht man dann deutlich, dass das Symbol für den Webseitenzoom und das Symbol mit den 3 Strichen weder in der Grösse noch in der Position geändert werden (das ist mir vorher gar nie aufgefallen). Gibt es für die eigene Bezeichnungen?

https://abload.de/img/firefoxtabdnnermache_udk3x.png

Ich lasse das sonst mal so. Du hast mir schon genug geholfen Und bei mir funktioniert das ja mehr oder weniger.

milupo

Zitat von sotnu

Mal eine Zwischenfrage: Wie findest du heraus, wie die Bezeichnungen für die jeweiligen Symbole, Leisten usw. sind? Wie kriegst du da die Namen heraus?

Hier kannst du dich umfassend belesen:

Anleitung zur Nutzung des Inspektors und der Stilbearbeitung aus den Entwicklerwerkzeugen

sotnu

Ah, na das ist doch viel einfacher, als jede Bezeichnung googlen zu müssen. Das hätte ich mal besser vorher lesen sollen Ich habe nur das Webseiten-Zeugs gelesen und dann gedacht, ist nicht das, was ich will.

sotnu

Code

.tab-line {
    height: 1px;
}

Eine Frage: Warum funktioniert das nicht? Wenn ich das mit den Entwicklerwerkzeuge ändere, geht es. Ich kopiere den code sogar direkt dort raus und trotzdem funktioniert es nicht.

2002Andreas

Teste bitte:

CSS

.tab-line {
    height: 1px !important;
}

sotnu

Ach so, das habe ich vergessen. Muss mich ein bisschen eingewöhnen, danke es geht

BrokenHeart

Zitat von sotnu

Also deinen aktuellsten code habe ich ausprobiert, leider funktioniert das gar nicht bei mir (es ändert nichts).

Das versteh ich nicht. Habe den Code mit dem aktuellen FF und der aktuellen Nightly getestet. Beta benutze ich nicht, kann mir aber kaum vorstellen, dass es ausgerechnet in dieser 'Zwischenversion' nicht funktionieren soll.

Befindet sich ausschließlisch der CSS-Code aus #24 in deiner 'userChrome.css' oder hast du dort noch andere Änderungen stehen?

Bitte überprüfen, ob beim Kopieren vielleicht was schiefgegangen ist?

So sieht es bei mir mit FF76 und FF78 aus:

sotnu

Noch ne frage: Ich weiss nicht, was ich gemacht habe, aber mittels crtl+shift+alt+I lässt sich bei der developer-edition keine browser-werkzeuge mehr öffnen. Auf der Beta geht es noch. Ich habe die Einstellungen verglichen und es ist bei beiden das Selbe. Ich kann es auch noch unter extras auswählen, es öffnet nur nicht mehr. Ich muss wohl irgend was falsches geklickt haben.

Ich habe den PC schon neu gestartet und die developer-edition im abgesichertem Modus gestartet, hilft aber alles nichts. Wenn ich die Tastenkombination drücke oder unter extras starte, kommt kurz ein Ladekreis auf und verschwindet wieder, mehr nicht. Es ist auch nichts im Hintergrund.

Vlt. habe ich bei dem Fenster, in dem ich ok drücken muss, ausversehen auf deaktivieren geklickt. Meine Maus hängt manchmal, kann sein, dass sie gesprungen ist.

BrokenHeart ja ich schaue mal nach, aber eigentlich lösche ich immer alles. Aber ich probiere es mal nochmals.

2002Andreas

Zitat von sotnu

keine browser-werkzeuge mehr öffnen

Teste.

Im Profilordner den Ordner:

chrome_debugger_profile

löschen, und den Fx neu starten.

milupo

Zitat von sotnu

Ich habe nur das Webseiten-Zeugs gelesen und dann gedacht, ist nicht das, was ich will.

Bequemlichkeit führt oft nicht zum Ziel.

Leider ist es in Forumsbeiträgen nicht möglich, Inhaltsverzeichnisse anzulegen.

BrokenHeart

Zitat von sotnu

Noch ne frage: Ich weiss nicht, was ich gemacht habe, aber mittels crtl+shift+alt+I lässt sich bei der developer-edition keine browser-werkzeuge mehr öffnen. Auf der Beta geht es noch. Ich habe die Einstellungen verglichen und es ist bei beiden das Selbe. Ich kann es auch noch unter extras auswählen, es öffnet nur nicht mehr. Ich muss wohl irgend was falsches geklickt haben.

Versuche mal < CTRL+RIGHT-SHIFT+ALT+I > Bei mir geht es auch nur so. Keine Ahnung, warum das so ist...

sotnu

BrokenHeart Also das ist jetzt komisch. Ich habe die developer-edition und die beta. Bei der Beta habe ich 2 verschiedene Profile. Und beim 2. Profil der beta geht es, beim anderen profil der beta nicht und bei der developer-edition auch nicht. Vermutlich ging auch deshalb der ursprüngliche code von reddit nicht? Muss ich nachher auch ausprobieren.

Ich habe den genau gleichen Code bei allen. Ich habe sogar den ganzen Chrome-Ordner der 2 anderen Profile mit dem einen überschrieben, beidem es geht. Aber es ändert nichts.

2002Andreas Danke, jetzt gehts wieder.

milupo: Ja

2002Andreas

Zitat von sotnu

Danke, jetzt gehts wieder.

Kommt manchmal vor, dann einfach wieder den Ordner löschen.

milupo

Zitat von sotnu

Bei der Beta habe ich 2 verschiedene Profile. Und beim 2. Profil der beta geht es, beim anderen profil der beta nicht und bei der developer-edition auch nicht.

Du hast bei allen verwendeten Profilen immer die Einstellung toolkit.legacyUserProfileCustomizations.stylesheets auf true gesetzt? Das musst du für jedes Profil machen. Einfach die userChrome.css kopieren reicht nicht.

sotnu

Also mit diesem code sieht es von aussen ziemlich sauber aus, nur wenn ich mit der Maus über die Symbole drüber fahre, dann sind die transparenten Boxen völlig verschoben (nur bei den Addon-Symbolen). Wobei im 2. Profil meiner beta siehts wieder völlig anders aus, als auf der developer. Das 1. Profil von der Beta und die developer sahen bis jetzt immer gleich aus mit gleichem code. Das 2- Profil auf der Beta funktioniert anscheinend immer unterschiedlich. Ich nutze dieses Profil selten, also kann es sein, dass da was anders ist. Ich weiss aber nicht was das sein soll.

Edit: Und es sind alle auf der neuesten Version laut "über Firefox"

Edit 2: Also beim 2. Profil von meiner beta funktioniert auch der ursprüngliche code aus reddit vom 1. Post.

Edit3: Ah im code stehen noch alle Notizen für mich mit drin

CSS

.tabbrowser-tab {
    min-height: 23px !important;
    max-height: 23px !important;
}

/*Das ist die Navigationsleite (dort, wo die Url-Leiste, Addonsymbole & Vor-und Zurückbutton sind)*/

#nav-bar {
    min-height: 24px !important;
    max-height: 24px !important;
    margin-top: -8px !important;
}

/*Das sollten die Symbole in der Navigationsleiste sein*/

#nav-bar .chromeclass-toolbar-additional .toolbarbutton-icon
{
    transform: scale(0.9,0.9) !important;
    margin-top: -8px !important;
}

/*Verändert das "+"-Zeichen um einen neuen Tab zu öffnen (funktioniert nicht)*/

/*#tabs-newtab-button {
    vertical-align: bottom !important;
    height: 22px;
}*/

/*Verändert (die Höhe) des schwarzen Hintergrund hinter den Tabs (aber nicht beliebig klein)*/

#TabsToolbar {
    min-height: 10px !important;
    max-height: 10px !important;
 }

/*verkleinert/vergrössert den Schliessen-,Minimieren- & Maximierenbutton*/

.titlebar-button {
    transform: translateY(-2px) scale(1,1);
}

/*Macht die (blaue) Linie beim aktiven Tab dünner*/

.tab-line {
    height: 1px !important;
}

/*Verändert die Höhe des (kompletten) Zoombutton*/

#zoom-controls {
    margin-top: -6px !important;
}

/*Verändert die Höhe des Menubutton (3 Striche)*/

#PanelUI-menu-button {
    margin-top: -6px !important;
}

/*Verändert die Höhe des "+" & "-" Zoombutton*/

#zoom-out-button, #zoom-in-button {
    margin-top: 6px !important;
}

Alles anzeigen

milupo Ja, ich habe alle auf true. Gerade vorhin geprüft. Keine Ahnung was das ist. Siehe auchdas Bild hier, da habe ich den Code von oben bei beiden Profilen verwendet und trotzdem sind sie unterschiedlich.

milupo

Also dein Code aus Beitrag #39 stimmt aber nicht mit dem von BrokenHeart aus Beitrag #24 überein. Den oberen Abstand von -8px hast du zusätzlich zum Selektor #nav-bar hinzugefügt. Das verschiebt natürlich die ganze Navigationsleiste.