- Firefox-Version
- Firefox 155.0a1
- Betriebssystem
- Windows 11 Pro 64 Bit
Hallo zusammen,
ist es möglich, das man die Länge der Tabs automatisch der Länge des Tablabels nach anpassen kann?
Hallo zusammen,
ist es möglich, das man die Länge der Tabs automatisch der Länge des Tablabels nach anpassen kann?
die Länge der Tabs automatisch der Länge des Tablabels
Meinst du das so?
Wenn ja, dann sagt die KI![]()
/* =========================================================
Firefox – Tabbreite automatisch an Tab-Label anpassen
Datei: chrome/userChrome.css
========================================================= */
/* ---------------------------------------------------------
1. Normale Tabs
--------------------------------------------------------- */
.tabbrowser-tab:not([pinned]) {
/*
* Tab darf seine Breite selbst bestimmen
*/
flex: 0 0 auto !important;
/*
* Keine von Firefox vorgegebene feste Breite
*/
width: auto !important;
min-width: 70px !important;
max-width: none !important;
}
/* ---------------------------------------------------------
2. Inhalt des Tabs
--------------------------------------------------------- */
.tabbrowser-tab:not([pinned]) .tab-content {
width: auto !important;
min-width: 0 !important;
max-width: none !important;
/*
* Etwas Abstand zwischen Label und Tab-Rand
*/
padding-inline: 8px !important;
}
/* ---------------------------------------------------------
3. Tab-Label
--------------------------------------------------------- */
.tabbrowser-tab:not([pinned]) .tab-label-container {
width: auto !important;
min-width: 0 !important;
max-width: none !important;
/*
* Verhindert, dass Firefox das Label künstlich
* auf eine bestimmte Breite begrenzt.
*/
flex: 0 0 auto !important;
}
.tabbrowser-tab:not([pinned]) .tab-label {
width: auto !important;
max-width: none !important;
/*
* Label darf seine natürliche Breite verwenden
*/
overflow: visible !important;
text-overflow: clip !important;
}
/* ---------------------------------------------------------
4. Schließen-Button
--------------------------------------------------------- */
.tabbrowser-tab:not([pinned]) .tab-close-button {
flex: 0 0 auto !important;
margin-inline-start: 6px !important;
}
/* ---------------------------------------------------------
5. Aktiver Tab
--------------------------------------------------------- */
.tabbrowser-tab[selected="true"]:not([pinned]) {
/*
* Auch der aktive Tab passt sich seinem Label an
*/
width: auto !important;
max-width: none !important;
}
/* ---------------------------------------------------------
6. Angeheftete Tabs nicht verändern
--------------------------------------------------------- */
.tabbrowser-tab[pinned] {
flex: 0 0 var(--tab-pinned-width) !important;
}
/* ---------------------------------------------------------
7. Tab-Leiste darf horizontal scrollen
--------------------------------------------------------- */
#tabbrowser-tabs {
overflow-x: auto !important;
}
/* ---------------------------------------------------------
8. Scrollbar der Tab-Leiste ausblenden
--------------------------------------------------------- */
#tabbrowser-tabs > .tabbrowser-arrowscrollbox {
scrollbar-width: none !important;
}
#tabbrowser-tabs > .tabbrowser-arrowscrollbox::-webkit-scrollbar {
display: none !important;
}
Alles anzeigen
oder auch so:
/* ============================================================
Firefox – dynamische Tabbreite nach Label
============================================================ */
/* ------------------------------------------------------------
Grundeinstellung für normale Tabs
------------------------------------------------------------ */
.tabbrowser-tab:not([pinned]) {
flex: 0 1 auto !important;
width: auto !important;
min-width: 50px !important;
max-width: 320px !important;
}
/* ------------------------------------------------------------
Tab-Inhalt darf seine natürliche Breite behalten
------------------------------------------------------------ */
.tabbrowser-tab:not([pinned]) .tab-content {
width: auto !important;
min-width: 0 !important;
max-width: none !important;
padding-inline: 7px !important;
}
/* ------------------------------------------------------------
Label-Container
------------------------------------------------------------ */
.tabbrowser-tab:not([pinned]) .tab-label-container {
flex: 0 1 auto !important;
width: auto !important;
min-width: 0 !important;
max-width: none !important;
}
/* ------------------------------------------------------------
Das eigentliche Label
------------------------------------------------------------ */
.tabbrowser-tab:not([pinned]) .tab-label {
display: block !important;
width: auto !important;
min-width: 0 !important;
max-width: 290px !important;
/*
* Lange Titel werden abgeschnitten statt den Tab
* unendlich breit werden zu lassen.
*/
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
/* ------------------------------------------------------------
Schließen-Button
------------------------------------------------------------ */
.tabbrowser-tab:not([pinned]) .tab-close-button {
flex: 0 0 auto !important;
margin-inline-start: 5px !important;
}
/* ------------------------------------------------------------
Aktiver Tab
------------------------------------------------------------ */
.tabbrowser-tab[selected="true"]:not([pinned]) {
flex: 0 1 auto !important;
width: auto !important;
min-width: 50px !important;
max-width: 320px !important;
}
/* ------------------------------------------------------------
Angeheftete Tabs bleiben normal
------------------------------------------------------------ */
.tabbrowser-tab[pinned] {
flex: 0 0 var(--tab-pinned-width) !important;
}
/* ------------------------------------------------------------
Tab-Leiste
------------------------------------------------------------ */
#tabbrowser-tabs {
overflow-x: auto !important;
}
/* ------------------------------------------------------------
Keine sichtbare Scrollbar
------------------------------------------------------------ */
#tabbrowser-tabs > .tabbrowser-arrowscrollbox {
scrollbar-width: none !important;
}
#tabbrowser-tabs > .tabbrowser-arrowscrollbox::-webkit-scrollbar {
display: none !important;
}
Alles anzeigen
Kannst das ja mal testen wenn du magst.
So funktioniert das hier im eigentlich vorgesehenem Thunderbird, Dankeschön dafür.
Das ist wirklich ganz simples CSS, aber darauf bin ich absolut nicht gekommen, also noch einmal, Dankeschön.
darauf bin ich absolut nicht gekommen
Und ich war zu faul...darum musste die KI ran![]()
Freut mich aber, wenn du damit zufrieden bist was sie geliefert hat.
Und ich war zu faul...darum musste die KI ran
Darf ich Dich dazu mal kurz privat ansprechen?
Freut mich aber, wenn du damit zufrieden bist was sie geliefert hat.
Ist ja letztendlich sehr viel kürzer geworden, also trotzdem nochmals vielen Dank. 😊
Darf ich Dich dazu mal kurz privat ansprechen?
Na klar.
Spricht etwas dagegen, das öffentlich zu besprechen? Ich weiß ja nicht, was das konkrete Anliegen ist. Aber vom Thema her könnte es für andere ja auch interessant sein. ![]()
Kannst das ja mal testen wenn du magst.
Für Firefox reicht auch eine verkürzte Version.
Für Firefox reicht auch eine verkürzte Version.
...
Funktioniert, aber nicht so meins.
Funktioniert, aber nicht so meins.
Du meinst wohl eher aber nicht so wie meins, oder?
Letztendlich sollte die Tabbreite von Tb bis zu einem bestimmten Maß angepasst werden und das tut es mit dem Schnipsel aus #3.
Du meinst wohl eher aber nicht so wie meins, oder?
Blöde Umgangssprache!
Ne, funktioniert einwandfrei! Ist aber nicht so mein Fall.
Werde dieses css wohl eher nicht nutzen.
Werde dieses css wohl eher nicht nutzen.
Wie sieht denn Dein CSS dazu aus?
Habe Dein, aber auch .DeJaVu's code nur mal in der Stilbearbeitung getestet.
Meine Anpassungen der Tabs willst Du gar nicht sehen. ![]()
Doch, => hier.
Werde aber mal als "Backup" das komplette Monster an css am Ende des Threads mal posten müssen.
Nachtrag!
Link aktualisiert, da Monster gepostet.
PS mein Fehler, Tabbreite dem Text anpassen ist keine kluge Idee... mein ja nur.