Tabtext zentrieren in Fx 89 (Script)

2002Andreas

Hallo @ all..

bis jetzt ist es ja ganz einfach den Tabtext per:

text-align: center !important;

zu zentrieren.

Ab Fx 89 (Proton aktiv) funktioniert das so nicht mehr.

Laut Aussage von Sören:

Zitat

Das Einfachste ist wahrscheinlich, für .tab-label-container via Script [align="start"] auf [align="center"] zu ändern. Aber damit alleine wäre es nicht getan. Für die zweizeilige Darstellung braucht es dann weitere Anpassungen.

#16

braucht man also erst ein Script dafür.

Meine Frage:

Hat schon jemand eine Lösung/Script für die Änderung?

Für jegliche Hilfe wie immer herzlichen Dank vorweg.

milupo

Zitat von 2002Andreas

Hat schon jemand eine Lösung/Script für die Änderung?

Nur für protonfreies Nightly. Da habe ich einen kurzen CSS-Code bei Aris gefunden, der aber eben schon älter ist, tab_title_centered.css, aber noch funktioniert:

https://github.com/Aris-t2/Custom…le_centered.css

2002Andreas

Zitat von milupo

Nur für protonfreies Nightly.

Danke für deine Hilfe

Den Code von Aris nutze ich hier bereits bis Version 88.

In 89 funktioniert er leider nicht mehr.

milupo

Zitat von 2002Andreas

Den Code von Aris nutze ich hier bereits bis Version 88.
In 89 funktioniert er leider nicht mehr.

Aber in Fx 90:

So richtig sinnvoll ist das aber wohl meistens nicht, denn sichtbar wird das nur bei kurzen Tab-Texten.

2002Andreas

Zitat von milupo

Aber in Fx 90:

Aber nicht wenn Proton aktiviert ist:

Und so möchte ich es gerne wieder haben dann:

milupo

Zitat von 2002Andreas

Aber nicht wenn Proton aktiviert ist:

Ich zitiere mich mal selbst:

Zitat von milupo

Nur für protonfreies Nightly.

Mal sehen, ob wir noch irgendetwas für Proton finden.

Sören Hentzschel

Anpassungen für ein "Protonfreies Nightly" wären sinnlos, denn ab Firefox 89 wird es kein anderes Design mehr geben. Anpassungen für Firefox 89 und höher müssen zwangsläufig Proton berücksichtigen. Zumal im Startbeitrag explizit Proton angegeben wurde.

Speravir

So etwas wie

CSS

.tab-label-container[align="start"] {
    text-align: center !important;
}

geht nicht? Vielleicht auch spezifischer .tab-label-container[align="start"] .tab-label oder ähnlich.

milupo

Ich weiß nicht, es gibt jetzt solche Eigenschaften mit align-Vorsatz. align-items, align-self und align-content. align-self und align-content habe ich versucht, klappt aber nicht.

2002Andreas

Zitat von Speravir

geht nicht?

Auch dir vielen Dank für deine Hilfe

Egal wie ich es mache, es funktioniert leider auch nicht.

Speravir

Zitat von milupo

Ich weiß nicht, es gibt jetzt solche Eigenschaften mit align-Vorsatz. align-items, align-self und align-content. align-self und align-content habe ich versucht, klappt aber nicht.

Mir ist ~~heute~~ gestern zufällig noch diese Eigenschaft über den Weg gelaufen: justify-self (Link zu MDN, bisher nur englisch), justify-self (SELFHTML-Wiki, deutsch).

Zitat von 2002Andreas

Egal wie ich es mache, es funktioniert leider auch nicht.

Schade!

Sören Hentzschel

Ihr bringt ein paar Standards durcheinander, einerseits CSS Flexbox (align-*), andererseits CSS Grid (justify-self). Beides verwendet Firefox hier nicht, sondern das XUL-Boxsystem. Wenn ihr Eigenschaften daraus verwenden wollt, müsst ihr das entsprechende Layout-System auch aktivieren. So würde ein Ansatz mittels CSS Flexbox wohl funktionieren:

CSS

.tab-content {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.tab-label-container {
  margin: auto !important;
}

.tabbrowser-tab > .tab-stack > .tab-content > .tab-close-button {
  flex-shrink: 0 !important;
  padding: 7px !important;
  width: 24px !important;
}

Alles anzeigen

2002Andreas

Zitat von Sören Hentzschel

So würde ein Ansatz mittels CSS Flexbox wohl funktionieren:

Hallo Sören,

ganz herzlichen Dank dafür, das funktioniert einwandfrei

Speravir

Zitat von Sören Hentzschel

Ihr bringt ein paar Standards durcheinander, einerseits CSS Flexbox (align-*), andererseits CSS Grid (justify-self).

Stümmpt. Wenn ich mir die MDN-Seite im Detail durchgelesen hätte, wäre mir das auch aufgefallen. Allerdings steht dort auch, dass justify-self auch im Blocklevel wirkt.

Zitat von Sören Hentzschel

Wenn ihr Eigenschaften daraus verwenden wollt, müsst ihr das entsprechende Layout-System auch aktivieren. So würde ein Ansatz mittels CSS Flexbox wohl funktionieren: