Hab Zeilenumbruch gerade mal aktiviert, dann sieht es zwar anders aus, aber er hängt immer noch alles hintereinander weg...
Ist es denn richtig, dass ich zum Kopieren auf dieses "2-Blätter-Icon" zum "Inhalt kopieren" klicke?
Hab Zeilenumbruch gerade mal aktiviert, dann sieht es zwar anders aus, aber er hängt immer noch alles hintereinander weg...
Ist es denn richtig, dass ich zum Kopieren auf dieses "2-Blätter-Icon" zum "Inhalt kopieren" klicke?
Ja, ist richtig. Ich hab's in mehreren Editoren getestet und es funktioniert gut. Daher mag das vielleicht am von dir verwendeten Editor liegen. Den kann ich nicht testen, da es ein reines Windows-Tool ist.
er hängt immer noch alles hintereinander weg...
Meinst du damit er hängt den neuen hinter den alten Code
Oder nur weil alles hintereinandergeschrieben ist?
Dann müsste der Code trotzdem funktionieren.
ich habe zu den Änderungen auch mal eine Frage, meine angehefteten Tabs hatten vorher kein "Schließen" kreuz, jetzt haben sie eins und dadurch ist der Tab sehr breit geworden.
Wie bekomme ich das schließen Kreuz wieder weg, aber nur an den angehefteten Tabs:?
Wie bekomme ich das schließen Kreuz wieder weg,
Wenn du den Code aus Beitrag Nr. 11 verwendest, dann den Eintrag:
display: -moz-box !important;
in Zeile 142 entfernen.
Vielen Dank das hat sehr gut funktioniert.
Freut mich wenn ich dir damit helfen konnte, war gern geschehen
Hat jemand einen Tip wie man die Tab-Beschriftung vertikal zentriert bekommt? vertical-align: bottom !important; in middle oder top zu ändern hilft nicht...
(Das gleiche gilt auch für die Icons in angepinnten Tabs)
Hallo Andreas,
Dank Dir funktioniert meine mehrzeilige Tab-Leiste wieder korrekt, dafür schon mal vielen Dank!
Was noch nicht ganz funktioniert:
Der aktive Tab färbt sich nicht in einer anderen Farbe und
meine schönen Noia Icons sind auch weg
Hier mal meine userchrome. Kannst Du Dir das viellecht mal ansehen ?!
/* Aktiver Tab */
.tabbrowser-tab[selected] .tab-content {
background: red !important;
color: white !important;
}
.tabbrowser-tab[selected] .tab-content:hover{
background: yellow !important;
color: blue !important;
}
/* Tableiste mehrreihig */
@-moz-document url(chrome://browser/content/browser.xhtml) {
[tabsintitlebar="true"][sizemode="maximized"] #navigator-toolbox {
padding-top: 8px !important;
}
#titlebar,#tabbrowser-tabs {
appearance: none !important;
}
[tabsintitlebar="true"] #TabsToolbar > .titlebar-buttonbox-container,
#main-window[inFullscreen="true"] #window-controls {
display: block;
}
/* Mehrreihige Tableiste, Anzahl der angezeigten Tabreihen = 3 Zeilen, weitere per Scrollbar */
box[class="scrollbox-clip"][orient="horizontal"],
tabs > arrowscrollbox { display: block; }
scrollbox[part][orient="horizontal"] {
display: flex;
flex-wrap: wrap;
max-height: calc(var(--tab-min-height) * 3); /* Anzahl der angezeigten Tabreihen = 3 Zeilen */
overflow-x: hidden;
overflow-y: auto;
}
tabs tab[fadein]:not([pinned]) {
flex-grow: 1;
}
tabs tab,.tab-background {
height: var(--tab-min-height);
overflow: hidden;
}
tab > .tab-stack {
width: 100%;
}
box[class="scrollbox-clip"][orient="horizontal"] {
-moz-window-dragging: no-drag;
}
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]) {
display: none;
}
/* Feste Breite der einzelnen Tabs wenn gewünscht, sonst entfernen bzw. verbreitern */
tabs tab[fadein]:not([pinned]) {
min-width: 150px !important;/* Minimale Tabbreite 76px */
max-width: 150px !important;/* Maximale Tabbreite 225px */
}
}
/* Buttons/Zwischenräume Ausblenden */
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]), [class="scrollbutton-up"],
[class="scrollbutton-up"] + spacer,
scrollbox[part][orient="horizontal"] + spacer,
[class="scrollbutton-down"] { display: none; }
/* Keine Favicon Animation */
.tabbrowser-tab[label*="BiT-TiTAN"] .tab-icon-image{ display:none!important; }
/*Mehrzeilige Lesezeichen-Symbolleiste*/
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
#PersonalToolbar {
max-height: calc(20px * 3) !important;
}
#personal-bookmarks,
#PlacesToolbar,
#PlacesToolbar > hbox {
display: block !important;
}
#PersonalToolbar toolbarbutton {
min-height: 20px !important;
max-height: 20px !important;
}
#PlacesToolbarItems {
max-height:60px!important;
display: flex!important;
flex-wrap: wrap!important;
overflow-x: visible!important;
overflow-y: auto!important;
}
#PlacesToolbar,
#PersonalToolbar > scrollbar {
-moz-window-dragging: no-drag !important;
}
#PlacesToolbar #PlacesChevron {
display: none !important;
}
}
/*AGENT_SHEET*/
/* Firefox 57+ userChrome.css tweaks ****************************************************/
/* code mostly taken from 'NoiaButtons' add-on ******************************************/
/* by Aris ([email='aris-addons@gmx.net'][/email])*********************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/
/****************************************************************************************/
/* NoiaButtons add-on for Firefox 57+ ***************************************************/
/****************************************************************************************/
/* icons for default browser buttons ****************************************************/
@import url(./css/toolbar_buttons_noia.css);
/*@import url(./css/toolbar_buttons_firefox1.css);*/
/*@import url(./css/toolbar_buttons_firefox2.css);*/
/*@import url(./css/toolbar_buttons_firefox3.css);*/
/*@import url(./css/toolbar_buttons_firefox3aero.css);*/
/* shrink icons on hover ****************************************************************/
@import url(./css/toolbar_buttons_reduce_size_on_hover.css);
/* icon size on navigation toolbar (auto: compact=24/normal=30/touch=36) ****************/
@import url(./css/toolbar_buttons_size_on_navbar_auto.css);
/*@import url(./css/toolbar_buttons_size_on_navbar_18px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_24px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_30px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_36px.css);*/
/* location bar: go button and autocomple dropmarker icons ******************************/
@import url(./css/locationbar_buttons.css);
/* light Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) **/
/*@import url(./css/noiaui_light.css);*/
/*@import url(./css/noiaui_light_tabs_below_navigation_toolbar.css);*/
/* dark Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) ***/
/*@import url(./css/noiaui_dark.css);*/
/*@import url(./css/noiaui_dark_tabs_below_navigation_toolbar.css);*/
/**/
/* This file can be used to customize the look of Mozilla's user interface
* You should consider using !important on rules which you want to override default settings.
*/
/* Do not remove the @namespace line -- it's required for correct functioning */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
/* Lesezeichen Sidebar - Ordnericon stehend gelb */
@-moz-document url("chrome://browser/content/bookmarks/bookmarksPanel.xul"),
url("chrome://browser/content/history/history-panel.xul") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen verwalten - Ordnericon stehend gelb */
@-moz-document url-prefix("chrome://browser/content/places/places.xul") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen - Ordnericon gelb */
@-moz-document url-prefix("chrome://browser/content/browser.xul") {
.bookmark-item[container="true"] {
fill:orange !important;}
}
#toolbar-menubar:not([autohide=true]) ~ #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab > .tab-stack > .tab-background {
border:none!important;}
#TabsToolbar .tabbrowser-tab {
color: white !important;
border: 1px solid !important;
border-bottom: none !important;
border-radius: 15px 15px 0 0 !important;
margin: 3px 1px 1px 2px !important;
padding: 1px 0 !important;
}
#TabsToolbar .tabbrowser-tab:hover {
color: white !important;
}
#TabsToolbar .tabbrowser-tab[selected="true"] {
background: orange !important;
color: white ! important;
}
#TabsToolbar .tab-icon-image {
height: 25px !important;
width: 20px !important;
margin-left: -4px !important;
margin-bottom: 2px !important;
}
#TabsToolbar .tab-close-button {
margin-right: -4px !important;
padding: 0 !important;
color: white !important;
}
#TabsToolbar .tabbrowser-tab * {
background: none !important;
}
/* Do not remove the @namespace line -- it's required for correct functioning
* set default namespace to XUL
*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
/**********************************************************
********** Reihenfolge der Leisten ***********************
**********************************************************/
/* Die Reihenfolge der Leisten im Leisten-Container wird durch die
* zugewiesenen Zahlen der "-moz-box-ordinal-group" bestimmt:
* Oben die Menü-Leiste, darunter die Navigations-Leiste danach
* die Lesezeichen-Leiste, unten die TAB-Leiste, so wie man es
* von früher her gewohnt ist.
*
* Oft wird eine andere Vorgehensweise beschrieben.
* Ob es wichtig ist? Ich habe sie jedenfalls einfach von 1 bis 4
* durchnummeriert, das ist übersichtlich und hat bisher geklappt.
*/
(function() {
if (!window.gBrowser)
return;
let tabbar = document.getElementById('TabsToolbar');
function showHideTabbar() {
tabbar.style.visibility = (gBrowser.visibleTabs.length == 1) ? 'collapse' : 'visible';
};
showHideTabbar();
let observer = new MutationObserver(showHideTabbar);
observer.observe(gBrowser.tabContainer, {childList: true});
})();
#tabbrowser-tabs .tabbrowser-arrowscrollbox,
#tabbrowser-tabs .arrowscrollbox-scrollbox {
display: block;
}
.scrollbutton-up,
.arrowscrollbox-overflow-start-indicator,
.scrollbutton-down,
.arrowscrollbox-overflow-end-indicator {
display: none !important;
}
/* tabs height for "classic tabs" */
#titlebar,#tabbrowser-tabs{
--tab-min-height: 20px !important;
}
.tabbrowser-tab:not([pinned]) {
flex-grow: 1;
max-height:20px!important;
min-width: 170px !important;
max-width: 170px !important;
}
.tabbrowser-tab,.tab-background {
min-height: var(--tab-min-height);
}
.tab-stack {
width: 100%;
}
#tabbrowser-tabs .scrollbox-innerbox {
display: flex;
flex-wrap: wrap;
overflow-y: auto !important;
min-height: var(--tab-min-height);
max-height: calc(4*var(--tab-min-height)) !important; /* 3 rows */
}
#tabbrowser-tabs .arrowscrollbox-scrollbox {
overflow: visible;
display: block;
}
#tabbrowser-tabs .scrollbutton-up,
#tabbrowser-tabs .scrollbutton-down,
#alltabs-button,
.tabbrowser-tab:not([fadein]){
display: none;
}
#main-window[tabsintitlebar] #tabbrowser-tabs {
-moz-window-dragging: no-drag;
}
/*Senkrechte Striche in der Menuleiste (Flexibler Zwischenraum=Strich)*/
#nav-bar toolbarspring {
background: transparent !important;
max-width: 0px !important;
min-width: 0px !important;
width: 0px !important;
border-left: 1px solid black !important;
border-right: 1px solid black !important;
margin-top: 4px !important;
margin-bottom: 4px !important;
}
/* ----------------------------*/
/* Mehrzeilige Tabreihen */
/* ----------------------------*/
/* Tab-Höhe */
.tabbrowser-tab {
min-height: 23px !important;
max-height: 23px !important;
vertical-align: bottom !important;
margin-top: 1px !important;
margin-bottom: 1px !important;
}
/* Feste Breite des einzelnem Tabs */
.tabbrowser-tab:not([pinned]) {
min-width: 140px !important;
}
/* Platz für Scrollbar schaffen */
.tabbrowser-tabs {
margin-right: -41px !important;
}
tabs > arrowscrollbox {
display: block;
}
scrollbox[part][orient="horizontal"] {
display: flex;
flex-wrap: wrap;
overflow: visible !important;
overflow-x: hidden !important;
overflow-y: auto !important;
min-height: 30px !important; /* Tab-Höhe(23px) + 2px */
max-height: calc( 5 * 23px ) !important; /* Anzahl der Tabreihen * Minimal-Höhe */
-moz-window-dragging: no-drag !important;
}
/* Buttons/Zwischenräume Ausblenden */
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]),
[class="scrollbutton-up"],
[class="scrollbutton-up"] + spacer,
scrollbox[part][orient="horizontal"] + spacer,
[class="scrollbutton-down"] {
display: none;
}
tabs tab {
border-left: solid 1px hsla(0,0%,50%,.5);
border-right: solid 1px hsla(0,0%,50%,.5);
}
tabs tab:after,tabs tab:before { display: none;}
#TabsToolbar:not(:-moz-lwtheme){
color: black !important;
}
#TabsToolbar > .titlebar-buttonbox-container {
display: none !important;
}
/* -----------------------------*/
/* Tab: Optische Anpassungen */
/* -----------------------------*/
#tabbrowser-tabs :not([fokus]){
opacity: 1!important;
}
/* Schriftart/Schriftgröße ändern */
.tabbrowser-tab .tab-label {
text-shadow: 1px 1px 0px #000000 !important;
font-weight: 500 !important;
font-size: 14px !important;
font-family: "TimesNewRoman" !important;
color: white !important;
}
.tabbrowser-tab .tab-label:not(:-moz-lwtheme) {
text-shadow: none !important;
color: black !important;
}
.tabbrowser-tab .tab-label[selected="true"] {
text-shadow: 1px 1px 0px #000000 !important;
color: white !important;
font-weight: 500 !important;
font-size: 14px !important;
font-family: "TimesNewRoman" !important;
}
/* Tab-Line entfernen */
#TabsToolbar .tabbrowser-tab .tab-line {
display: none !important;
}
/* Tab-Höhe */
.tabbrowser-tab {
min-height: 23px !important;
max-height: 23px !important;
vertical-align: bottom !important;
margin-top: 1px !important;
margin-bottom: 1px !important;
}
/* Tab-Rahmen entfernen */
#TabsToolbar .tabbrowser-tab[visuallyselected="true"],
#TabsToolbar .tabbrowser-tab,
#TabsToolbar .tabbrowser-tab .tab-background {
background: unset !important;
border-top: unset !important;
outline: none !important;
}
/* Tab-Schließen-Button entfernen *//*
.tabbrowser-tab .tab-close-button {
visibility: collapse !important;
}
*/
/* Tab-Icon ausrichten *//*
.tab-throbber:not([pinned]),
.tab-sharing-icon-overlay:not([pinned]),
.tab-icon-pending:not([pinned]),
.tab-icon-image:not([pinned])
{
margin-top: -1px !important;
}
*/
/*------------------*/
/* Tab-Hintergrund */
/*------------------*/
.tab-background[selected=true]:-moz-lwtheme > spacer {
background-image: linear-gradient( rgba(103,171,224,1), rgba(10,58,95,1) ), none !important;
filter: drop-shadow(3px 3px 2px rgba(0,0,0,0.33)) drop-shadow(-2px 3px 2px rgba(0,0,0,0.33)) !important;
}
/*--- hover(nicht selektiert) ---*/
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]):not(:-moz-lwtheme) > spacer {
background-image: linear-gradient( rgba(255,255,255,1), rgba(115,115,115,1) ), none !important;
filter: brightness(130%) contrast(95%) drop-shadow(1px 1px 1px rgba(0,0,0,0.33)) drop-shadow(-1px 1px 1px rgba(0,0,0,0.33)) !important;
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]):-moz-lwtheme > spacer {
background-image: linear-gradient( rgba(225,225,225,0.66), rgba(100,125,145,0.66) ), none !important;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
}
/*--- nicht selektiert ---*/
.tab-background:not([selected=true]):not(:-moz-lwtheme) > spacer {
background-image: linear-gradient( rgba(255,255,255,1), rgba(125,125,125,1) ), none !important;
filter: brightness(115%) contrast(90%) drop-shadow(1px 1px 1px rgba(0,0,0,0.33)) drop-shadow(-1px 1px 1px rgba(0,0,0,0.33)) !important;
}
.tab-background:not([selected=true]):-moz-lwtheme > spacer {
background-image: linear-gradient( rgba(255,255,255,0.33), rgba(110,110,110,0.33) ), none !important;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
}
/*--- Multi-selektiert ---*/
.tab-background[multiselected=true]:not([selected=true]) > spacer {
background-image: linear-gradient( rgba(225,225,225,1), rgba(50,98,135,1) ), none !important;
}
.tabbrowser-tab:hover > .tab-stack > .tab-background[multiselected=true]:not([selected=true]) > spacer {
background-image: linear-gradient( rgba(225,225,225,1), rgba(50,98,135,1) ), none !important;
}
Alles anzeigen
Edit 2002Andreas
Text in Klammercode </> gesetzt.
Bei mir scheint irgendwie der Wurm drin zu sein seit FF81.
Ich hab dazu auch einen Thread aufgemacht, weil irgendwie bei mir die CSS hier aus dem Thread nicht richtig funktionieren.
Link => RE: TABs viel zu klein !
Kannst Du Dir das viellecht mal ansehen ?!
Dein Code ist das reinste Chaos
Da sind zig Einträge für die Tabs doppelt, und dann auch noch mit unterschiedlichen Werten und Farben, logisch dass das nicht richtig funktioniert.
Dann befindet sich ein Script in der Datei, das hat da nichts zu suchen.
Das wäre ein angepasster Code:
/* Aktiver Tab */
.tabbrowser-tab[selected] .tab-content {
background: red !important;
color: white !important;
}
.tabbrowser-tab[selected] .tab-content:hover{
background: yellow !important;
color: blue !important;
}
/* Tableiste mehrreihig */
@-moz-document url(chrome://browser/content/browser.xhtml) {
[tabsintitlebar="true"][sizemode="maximized"] #navigator-toolbox {
padding-top: 8px !important;
}
#titlebar,#tabbrowser-tabs {
appearance: none !important;
}
[tabsintitlebar="true"] #TabsToolbar > .titlebar-buttonbox-container,
#main-window[inFullscreen="true"] #window-controls {
display: block;
}
/* Mehrreihige Tableiste, Anzahl der angezeigten Tabreihen = 3 Zeilen, weitere per Scrollbar */
box[class="scrollbox-clip"][orient="horizontal"],
tabs > arrowscrollbox { display: block; }
scrollbox[part][orient="horizontal"] {
display: flex;
flex-wrap: wrap;
max-height: calc(var(--tab-min-height) * 3); /* Anzahl der angezeigten Tabreihen = 3 Zeilen */
overflow-x: hidden;
overflow-y: auto;
}
tabs tab[fadein]:not([pinned]) {
flex-grow: 1;
}
tabs tab,.tab-background {
height: var(--tab-min-height);
overflow: hidden;
}
tab > .tab-stack {
width: 100%;
}
box[class="scrollbox-clip"][orient="horizontal"] {
-moz-window-dragging: no-drag;
}
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]) {
display: none;
}
/* Feste Breite der einzelnen Tabs wenn gewünscht, sonst entfernen bzw. verbreitern */
tabs tab[fadein]:not([pinned]) {
min-width: 150px !important;/* Minimale Tabbreite 76px */
max-width: 150px !important;/* Maximale Tabbreite 225px */
}
}
/* Buttons/Zwischenräume Ausblenden */
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]), [class="scrollbutton-up"],
[class="scrollbutton-up"] + spacer,
scrollbox[part][orient="horizontal"] + spacer,
[class="scrollbutton-down"] { display: none; }
/* Keine Favicon Animation */
.tabbrowser-tab[label*="BiT-TiTAN"] .tab-icon-image{ display:none!important; }
/*Mehrzeilige Lesezeichen-Symbolleiste*/
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
#PersonalToolbar {
max-height: calc(20px * 3) !important;
}
#personal-bookmarks,
#PlacesToolbar,
#PlacesToolbar > hbox {
display: block !important;
}
#PersonalToolbar toolbarbutton {
min-height: 20px !important;
max-height: 20px !important;
}
#PlacesToolbarItems {
max-height:60px!important;
display: flex!important;
flex-wrap: wrap!important;
overflow-x: visible!important;
overflow-y: auto!important;
}
#PlacesToolbar,
#PersonalToolbar > scrollbar {
-moz-window-dragging: no-drag !important;
}
#PlacesToolbar #PlacesChevron {
display: none !important;
}
}
/*AGENT_SHEET*/
/* Firefox 57+ userChrome.css tweaks ****************************************************/
/* code mostly taken from 'NoiaButtons' add-on ******************************************/
/* by Aris ([email='aris-addons@gmx.net'][/email])*********************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/
/****************************************************************************************/
/* NoiaButtons add-on for Firefox 57+ ***************************************************/
/****************************************************************************************/
/* icons for default browser buttons ****************************************************/
@import url(./css/toolbar_buttons_noia.css);
/*@import url(./css/toolbar_buttons_firefox1.css);*/
/*@import url(./css/toolbar_buttons_firefox2.css);*/
/*@import url(./css/toolbar_buttons_firefox3.css);*/
/*@import url(./css/toolbar_buttons_firefox3aero.css);*/
/* shrink icons on hover ****************************************************************/
@import url(./css/toolbar_buttons_reduce_size_on_hover.css);
/* icon size on navigation toolbar (auto: compact=24/normal=30/touch=36) ****************/
@import url(./css/toolbar_buttons_size_on_navbar_auto.css);
/*@import url(./css/toolbar_buttons_size_on_navbar_18px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_24px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_30px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_36px.css);*/
/* location bar: go button and autocomple dropmarker icons ******************************/
@import url(./css/locationbar_buttons.css);
/* light Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) **/
/*@import url(./css/noiaui_light.css);*/
/*@import url(./css/noiaui_light_tabs_below_navigation_toolbar.css);*/
/* dark Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) ***/
/*@import url(./css/noiaui_dark.css);*/
/*@import url(./css/noiaui_dark_tabs_below_navigation_toolbar.css);*/
/* Lesezeichen Sidebar - Ordnericon stehend gelb */
@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen verwalten - Ordnericon stehend gelb */
@-moz-document url-prefix("chrome://browser/content/places/places.xhtml") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen - Ordnericon gelb */
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
.bookmark-item[container="true"] {
fill:orange !important;}
}
#toolbar-menubar:not([autohide=true]) ~ #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab > .tab-stack > .tab-background {
border:none!important;}
/*Senkrechte Striche in der Menuleiste (Flexibler Zwischenraum=Strich)*/
#nav-bar toolbarspring {
background: transparent !important;
max-width: 0px !important;
min-width: 0px !important;
width: 0px !important;
border-left: 1px solid black !important;
border-right: 1px solid black !important;
margin-top: 4px !important;
margin-bottom: 4px !important;
}
/* Tab-Line entfernen */
#TabsToolbar .tabbrowser-tab .tab-line {
display: none !important;
}
Alles anzeigen
Hallo Andreas,
das glaube ich Dir gerne. Die letzten Jahre haben wir immer wieder daran rumgedocktort, aber grundsätzlich hats eigentlich gut funktioniert.
Ich habe jetzt Deinen Code ausprobiert. Danke dafür !
Jetzt funktionieren die Farbe, meine schönen abgerundeten Tabs sind aber wech und die Noia Icons auch noch.
Können wir das noch lösen ?
meine schönen abgerundeten Tabs sind aber wech
Teste bitte diesen kompl. Code wieder:
.tabbrowser-tab:not([selected="true"]) > .tab-stack > .tab-background {
background: none !important;
}
#TabsToolbar {
margin-bottom:1px!important;
}
.tab-background[selected="true"] {
background: orange !important;
border-radius: 80px !important;
border:1px solid black!important;
}
.tabbrowser-tab:not([selected="true"]){
background: lightblue !important;
border-radius: 80px !important;
border:1px solid black!important;
}
.tabbrowser-tab::after, .tabbrowser-tab::before {
margin-inline-start: 0px!important;
border-left: 0px solid!important;
border-image:none!important;
border-image-slice: 0!important;
width: 0px!important;
box-sizing: border-box;
opacity: 0!important;
}
.tab-line {
display:none!important
}
.tabbrowser-tab[selected] .tab-content:hover{
background: yellow !important;
color: blue !important;
}
/* Tableiste mehrreihig */
@-moz-document url(chrome://browser/content/browser.xhtml) {
[tabsintitlebar="true"][sizemode="maximized"] #navigator-toolbox {
padding-top: 8px !important;
}
#titlebar,#tabbrowser-tabs {
appearance: none !important;
}
[tabsintitlebar="true"] #TabsToolbar > .titlebar-buttonbox-container,
#main-window[inFullscreen="true"] #window-controls {
display: block;
}
/* Mehrreihige Tableiste, Anzahl der angezeigten Tabreihen = 3 Zeilen, weitere per Scrollbar */
box[class="scrollbox-clip"][orient="horizontal"],
tabs > arrowscrollbox { display: block; }
scrollbox[part][orient="horizontal"] {
display: flex;
flex-wrap: wrap;
max-height: calc(var(--tab-min-height) * 3); /* Anzahl der angezeigten Tabreihen = 3 Zeilen */
overflow-x: hidden;
overflow-y: auto;
}
tabs tab[fadein]:not([pinned]) {
flex-grow: 1;
}
tabs tab,.tab-background {
height: var(--tab-min-height);
overflow: hidden;
}
tab > .tab-stack {
width: 100%;
}
box[class="scrollbox-clip"][orient="horizontal"] {
-moz-window-dragging: no-drag;
}
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]) {
display: none;
}
/* Feste Breite der einzelnen Tabs wenn gewünscht, sonst entfernen bzw. verbreitern */
tabs tab[fadein]:not([pinned]) {
min-width: 150px !important;/* Minimale Tabbreite 76px */
max-width: 150px !important;/* Maximale Tabbreite 225px */
}
}
/* Buttons/Zwischenräume Ausblenden */
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]), [class="scrollbutton-up"],
[class="scrollbutton-up"] + spacer,
scrollbox[part][orient="horizontal"] + spacer,
[class="scrollbutton-down"] { display: none; }
/* Keine Favicon Animation */
.tabbrowser-tab[label*="BiT-TiTAN"] .tab-icon-image{ display:none!important; }
/*Mehrzeilige Lesezeichen-Symbolleiste*/
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
#PersonalToolbar {
max-height: calc(20px * 3) !important;
}
#personal-bookmarks,
#PlacesToolbar,
#PlacesToolbar > hbox {
display: block !important;
}
#PersonalToolbar toolbarbutton {
min-height: 20px !important;
max-height: 20px !important;
}
#PlacesToolbarItems {
max-height:60px!important;
display: flex!important;
flex-wrap: wrap!important;
overflow-x: visible!important;
overflow-y: auto!important;
}
#PlacesToolbar,
#PersonalToolbar > scrollbar {
-moz-window-dragging: no-drag !important;
}
#PlacesToolbar #PlacesChevron {
display: none !important;
}
}
/*AGENT_SHEET*/
/* Firefox 57+ userChrome.css tweaks ****************************************************/
/* code mostly taken from 'NoiaButtons' add-on ******************************************/
/* by Aris ([email='aris-addons@gmx.net'][/email])*********************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/
/****************************************************************************************/
/* NoiaButtons add-on for Firefox 57+ ***************************************************/
/****************************************************************************************/
/* icons for default browser buttons ****************************************************/
@import url(./css/toolbar_buttons_noia.css);
/*@import url(./css/toolbar_buttons_firefox1.css);*/
/*@import url(./css/toolbar_buttons_firefox2.css);*/
/*@import url(./css/toolbar_buttons_firefox3.css);*/
/*@import url(./css/toolbar_buttons_firefox3aero.css);*/
/* shrink icons on hover ****************************************************************/
@import url(./css/toolbar_buttons_reduce_size_on_hover.css);
/* icon size on navigation toolbar (auto: compact=24/normal=30/touch=36) ****************/
@import url(./css/toolbar_buttons_size_on_navbar_auto.css);
/*@import url(./css/toolbar_buttons_size_on_navbar_18px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_24px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_30px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_36px.css);*/
/* location bar: go button and autocomple dropmarker icons ******************************/
@import url(./css/locationbar_buttons.css);
/* light Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) **/
/*@import url(./css/noiaui_light.css);*/
/*@import url(./css/noiaui_light_tabs_below_navigation_toolbar.css);*/
/* dark Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) ***/
/*@import url(./css/noiaui_dark.css);*/
/*@import url(./css/noiaui_dark_tabs_below_navigation_toolbar.css);*/
/* Lesezeichen Sidebar - Ordnericon stehend gelb */
@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen verwalten - Ordnericon stehend gelb */
@-moz-document url-prefix("chrome://browser/content/places/places.xhtml") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen - Ordnericon gelb */
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
.bookmark-item[container="true"] {
fill:orange !important;}
}
#toolbar-menubar:not([autohide=true]) ~ #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab > .tab-stack > .tab-background {
border:none!important;}
/*Senkrechte Striche in der Menuleiste (Flexibler Zwischenraum=Strich)*/
#nav-bar toolbarspring {
background: transparent !important;
max-width: 0px !important;
min-width: 0px !important;
width: 0px !important;
border-left: 1px solid black !important;
border-right: 1px solid black !important;
margin-top: 4px !important;
margin-bottom: 4px !important;
}
/* Tab-Line entfernen */
#TabsToolbar .tabbrowser-tab .tab-line {
display: none !important;
}
Alles anzeigen
die Noia Icons auch noch.
Daran habe ich aber nichts verändert, der Import dafür ist ab Zeile 232 im Code.
Ich habe nochmal ein bischen rumprobiert und das Skript für den Import der Noia Icons an den Anfang gestellt.
Jetzt funktioniert es komischerweise.
Nur die Tabs sind jetzt von der Höhe viel zu groß. Ich habe versucht es nachzuvollziehen, aber ich komme nicht darauf.
Welche Zeile verändere ich, damit die Höhe kleiner wird ?
das Skript für den Import der Noia Icons an den Anfang gestellt.
Jetzt funktioniert es komischerweise.
Das ist logisch. @import-Anweisungen müssen immer am Anfang der userChrome.css bzw. userContent.css stehen. Es darf kein normaler CSS-Code davor stehen. Am besten du verteilst alle deine CSS-Codes in eigene CSS-Dateien und schreibst nur deren @import-Anweisungen in die userChrome.css bzw. userContent.css.
damit die Höhe kleiner wird ?
Teste bitte diesen kompl. Code mal:
/*AGENT_SHEET*/
/* Firefox 57+ userChrome.css tweaks ****************************************************/
/* code mostly taken from 'NoiaButtons' add-on ******************************************/
/* by Aris ([email='aris-addons@gmx.net'][/email])*********************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/
/****************************************************************************************/
/* NoiaButtons add-on for Firefox 57+ ***************************************************/
/****************************************************************************************/
/* icons for default browser buttons ****************************************************/
@import url(./css/toolbar_buttons_noia.css);
/*@import url(./css/toolbar_buttons_firefox1.css);*/
/*@import url(./css/toolbar_buttons_firefox2.css);*/
/*@import url(./css/toolbar_buttons_firefox3.css);*/
/*@import url(./css/toolbar_buttons_firefox3aero.css);*/
/* shrink icons on hover ****************************************************************/
@import url(./css/toolbar_buttons_reduce_size_on_hover.css);
/* icon size on navigation toolbar (auto: compact=24/normal=30/touch=36) ****************/
@import url(./css/toolbar_buttons_size_on_navbar_auto.css);
/*@import url(./css/toolbar_buttons_size_on_navbar_18px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_24px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_30px.css);*/
/*@import url(./css/toolbar_buttons_size_on_navbar_36px.css);*/
/* location bar: go button and autocomple dropmarker icons ******************************/
@import url(./css/locationbar_buttons.css);
/* light Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) **/
/*@import url(./css/noiaui_light.css);*/
/*@import url(./css/noiaui_light_tabs_below_navigation_toolbar.css);*/
/* dark Noia theme for tabs & toolbars + 'tabs not on top' (known from "Noia" themes) ***/
/*@import url(./css/noiaui_dark.css);*/
/*@import url(./css/noiaui_dark_tabs_below_navigation_toolbar.css);*/
/*--------------------------------------------------------------------------------------------------*/
/* Höhe der Tabs*/
:root {
--tab-min-height: 25px !important;
}
:root #tabbrowser-tabs {
--tab-min-height: 25px !important;
}
.tabbrowser-tab:not([selected="true"]) > .tab-stack > .tab-background {
background: none !important;
}
#TabsToolbar {
margin-top: 2px !important;
margin-bottom: -3px !important;
}
.tab-background[selected="true"] {
background: orange !important;
border-radius: 80px !important;
border:1px solid black!important;
}
.tabbrowser-tab:not([selected="true"]){
background: lightblue !important;
border-radius: 80px !important;
border:1px solid black!important;
}
.tabbrowser-tab::after, .tabbrowser-tab::before {
margin-inline-start: 0px!important;
border-left: 0px solid!important;
border-image:none!important;
border-image-slice: 0!important;
width: 0px!important;
box-sizing: border-box;
opacity: 0!important;
}
.tab-line {
display:none!important
}
.tabbrowser-tab[selected] .tab-content:hover{
background: yellow !important;
color: blue !important;
}
/* Tableiste mehrreihig */
@-moz-document url(chrome://browser/content/browser.xhtml) {
[tabsintitlebar="true"][sizemode="maximized"] #navigator-toolbox {
padding-top: 8px !important;
}
#titlebar,#tabbrowser-tabs {
appearance: none !important;
}
[tabsintitlebar="true"] #TabsToolbar > .titlebar-buttonbox-container,
#main-window[inFullscreen="true"] #window-controls {
display: block;
}
/* Mehrreihige Tableiste, Anzahl der angezeigten Tabreihen = 3 Zeilen, weitere per Scrollbar */
box[class="scrollbox-clip"][orient="horizontal"],
tabs > arrowscrollbox { display: block; }
scrollbox[part][orient="horizontal"] {
display: flex;
flex-wrap: wrap;
max-height: calc(var(--tab-min-height) * 3); /* Anzahl der angezeigten Tabreihen = 3 Zeilen */
overflow-x: hidden;
overflow-y: auto;
}
tabs tab[fadein]:not([pinned]) {
flex-grow: 1;
}
tabs tab,.tab-background {
height: var(--tab-min-height);
overflow: hidden;
}
tab > .tab-stack {
width: 100%;
}
box[class="scrollbox-clip"][orient="horizontal"] {
-moz-window-dragging: no-drag;
}
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]) {
display: none;
}
/* Feste Breite der einzelnen Tabs wenn gewünscht, sonst entfernen bzw. verbreitern */
tabs tab[fadein]:not([pinned]) {
min-width: 150px !important;/* Minimale Tabbreite 76px */
max-width: 150px !important;/* Maximale Tabbreite 225px */
}
}
/* Buttons/Zwischenräume Ausblenden */
hbox.titlebar-spacer,
#alltabs-button,tabs tab:not([fadein]), [class="scrollbutton-up"],
[class="scrollbutton-up"] + spacer,
scrollbox[part][orient="horizontal"] + spacer,
[class="scrollbutton-down"] { display: none; }
/* Keine Favicon Animation */
.tabbrowser-tab[label*="BiT-TiTAN"] .tab-icon-image{ display:none!important; }
/*Mehrzeilige Lesezeichen-Symbolleiste*/
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
#PersonalToolbar {
max-height: calc(20px * 3) !important;
}
#personal-bookmarks,
#PlacesToolbar,
#PlacesToolbar > hbox {
display: block !important;
}
#PersonalToolbar toolbarbutton {
min-height: 20px !important;
max-height: 20px !important;
}
#PlacesToolbarItems {
max-height:60px!important;
display: flex!important;
flex-wrap: wrap!important;
overflow-x: visible!important;
overflow-y: auto!important;
}
#PlacesToolbar,
#PersonalToolbar > scrollbar {
-moz-window-dragging: no-drag !important;
}
#PlacesToolbar #PlacesChevron {
display: none !important;
}
}
/* Lesezeichen Sidebar - Ordnericon stehend gelb */
@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen verwalten - Ordnericon stehend gelb */
@-moz-document url-prefix("chrome://browser/content/places/places.xhtml") {
treechildren::-moz-tree-image(container) {
fill:orange !important;}
}
/* Lesezeichen - Ordnericon gelb */
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
.bookmark-item[container="true"] {
fill:orange !important;}
}
#toolbar-menubar:not([autohide=true]) ~ #TabsToolbar > #tabbrowser-tabs > .tabbrowser-tab > .tab-stack > .tab-background {
border:none!important;}
/*Senkrechte Striche in der Menuleiste (Flexibler Zwischenraum=Strich)*/
#nav-bar toolbarspring {
background: transparent !important;
max-width: 0px !important;
min-width: 0px !important;
width: 0px !important;
border-left: 1px solid black !important;
border-right: 1px solid black !important;
margin-top: 4px !important;
margin-bottom: 4px !important;
}
/* Tab-Line entfernen */
#TabsToolbar .tabbrowser-tab .tab-line {
display: none !important;
}
Alles anzeigen
In Zeile 75 und 78 den Wert für dich noch anpassen wenn nötig.
Ah, noch nicht ganz...
Die Höhe der Tabs würde jetzt passen, aber die Schrift in den Tabs ist nicht mittig, sondern zu weit unten und ragt etwa zur Häfte über die untere Tab-Begrenzung hinaus.
Vermutung von mir.
Das liegt an dem Code für die Icons. Deine Suchleiste ist ja auch viel zu groß