Button-Inhalt unmittig (nach Proton-Einführung)

Hallo,

zurechtgebogen hab ich schon die Rundungen der Tab-Oberkanten ,

aber die horizontale Unmittigkeit des Inhaltes des "tab-close-button" und "tabs-newtab-button" krieg ich nicht weg.
Komischerweise bei hoover des Tabs rückt das schwarze Kreuz in die Mitte, wo es sein soll.

Beim "tabs-newtab-button" bleibt aber auch dann die (kleine) Unmittigkeit.

"justify-content: center", was bei ".toolbarbutton-badge-stack" schon mal half, wirkt hier offenbar nicht.
Hat jemand eine Idee dazu?

- - -

Freundliche Grüße

Uwe

Das sind die Zeilen, die das derzeitige Aussehen der zwei Buttons beeinflussen:

.tab-close-button { height: 27px !important; width: 30px !important;
    border: 1px solid black !important; border-radius: 0 !important;
    fill: black !important; background: red !important }
    
#tabs-newtab-button .toolbarbutton-icon {
    border: 1px solid #81FBE4 !important; border-radius: 0 !important; 
    height: 26px !important; width: 35px !important }

Zitat von Dharkness

Hi,

ändere das mal Test halber dahingehend ↓.

CSS

.tab-close-button {
    height: 27px !important;
    width: 30px !important;
    border: 1px solid black !important;
    border-radius: 0 !important;
    fill: black !important;
    background: red !important
    padding: 0 !important;
}
    
#tabs-newtab-button {
    padding: 0 !important;
}    
#tabs-newtab-button .toolbarbutton-icon {
    border: 1px solid #81FBE4 !important;
    border-radius: 0 !important; 
    height: 26px !important;
    width: 35px !important;
}

Alles anzeigen

Beim close-Button halt es gewirkt, das Kreuz ist jetzt zwar riesig, gefällt mir aber sogar .
Beim Newtab-Button sehe ich keine Änderung.


Aber schon mal vielen Dank für die Hilfe

Zitat von 2002Andreas

Zitat von uwe_p

die horizontale Unmittigkeit

Teste bitte mal:

CSS

.tab-close-button { height: 27px !important; width: 27px !important;
    border: 1px solid black !important; border-radius: 0 !important;
    fill: black !important; background: red !important; }
    
#tabs-newtab-button .toolbarbutton-icon {
    border: 1px solid #81FBE4 !important; border-radius: 0 !important; 
    height: 26px !important; width: 35px !important }

#tabs-newtab-button,
.tab-close-button {
   padding: 7px !important;
}

Alles anzeigen

Der newtab-Button will noch nicht so richtig, aber beim close-Button bin ich mit padding: 2px sehr zufrieden:

Zitat von 2002Andreas

Ich habe extra mal rot zusätzlich als Hg genommen, und weiß als Farbe dafür, musst du dann wieder entfernen.

CSS

.tab-close-button { height: 27px !important; width: 27px !important;
    border: 1px solid black !important; border-radius: 0 !important;
    fill: black !important; background: red !important; }
    
#tabs-newtab-button .toolbarbutton-icon {
    border: 1px solid #81FBE4 !important; border-radius: 0 !important; background: red !important;
  fill: white !important;
    height: 29px !important; width: 35px !important }

#tabs-newtab-button,
.tab-close-button {
   padding: 7px !important;
}  

Alles anzeigen

War wohl eine Täuschung, der ich erlegen war. Sieht ja eigentlich doch ziemlich mittig aus.
Danke nochmals für die Unterstützung.

Freundliche Grüße

Uwe