- Firefox-Version
- 72.0.1
- Betriebssystem
- Windows 10
Ich habe schon einmal gesehen, dass man die Tabs in der Tableiste mit aberundeten Ecken darstellen lassen kann.
Weiß jemand, wie das gemacht wird?
Ich habe schon einmal gesehen, dass man die Tabs in der Tableiste mit aberundeten Ecken darstellen lassen kann.
Weiß jemand, wie das gemacht wird?
probier das mal
/*.tabbrowser-tab:not([selected="true"]){*/
.tabbrowser-tab:not([selected]) {
background: rgb(187,187,187) !important;
border: 1px solid black !important;
color: black !important;
border-top-right-radius: 8px !important;
border-top-left-radius: 8px !important;
}
.tab-background[selected] {
background: rgb(249,249,250) !important;
border: 1px solid black !important;
border-top-right-radius: 8px !important;
border-top-left-radius: 8px !important;
font-weight: bold !important;
}
Alles anzeigen
Bei border-radius: 0px wird wohl nichts abgerundet, man muss dann auch schon einen höheren Wert angeben, entweder wie mit px oder als Prozentzahl.
Ich benutze diesen Code
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/Aris-t2/CustomCSSforFx/blob/master/classic/css/tabs/default_tabs_round_top_borders.css */
/* geändert am 18.11.2019 vom EDV-Oldie *************************************************/
:root {
--default_tab_border_roundness: 10px;
}
/* tab top border roundness */
#TabsToolbar .tabbrowser-tab,
#TabsToolbar .tabbrowser-tab .tab-stack,
#TabsToolbar .tabbrowser-tab .tab-background,
#TabsToolbar .tabbrowser-tab .tab-content {
border-top-left-radius: var(--default_tab_border_roundness) !important;
border-top-right-radius: var(--default_tab_border_roundness) !important;
}
#TabsToolbar .tabs-newtab-button {
border-top-left-radius: var(--default_tab_border_roundness) !important;
border-top-right-radius: var(--default_tab_border_roundness) !important;
}
/* hide tab separators */
.tabbrowser-tab::after,
.tabbrowser-tab::before {
opacity: 0 !important;
border-image: unset !important;
border-image-slice: unset !important;
width: unset !important;
}
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
content: unset !important;
display: unset !important;
}
.tabbrowser-tab[selected],
.tab-background[selected] {
color: white !important;
border: 2px solid white !important;
}
.tabbrowser-tab:not([selected]){
color: black!important;
border: 1px solid gray !important;
}
.tabbrowser-tab[selected] .tab-content {
background: darkgray !important;
}
.tabbrowser-tab {
margin-left: 3px !important;
}
#TabsToolbar .tab-close-button[selected="true"] {
color: white !important;
}
Alles anzeigen
Gruß
EDV-Oldi
da hab ich wohl durch herumprobieren vergessen die Zeile zu löschen
Vielen Dank. Das gefällt mir sehr gut.