die Tabs in der Mitte (Zentral) anfangen
Dann poste deinen bisherigen Code...
die Tabs in der Mitte (Zentral) anfangen
Dann poste deinen bisherigen Code...
Dein Wunsch ist mir Befehl . Ich hab da selbst schon mal drinnen was verändert und du siehst ja selbst das der Code schon älter ist...
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/
@import "./tabs_below_navigation_toolbar.css";
/* [!] NOT A STANDALONE FILE! */
/* [!] This code does not achieve the requested result without above files content! */
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {
padding-bottom: calc(1px + var(--tab-min-height_tnot)) !important;
}
#TabsToolbar {
position: absolute !important;
display: flex !important;
bottom: 0px !important;
width: 100vw !important;
}
#tabbrowser-tabs {
width: 100vw !important;
}
/* make sure button icon colors set correctly */
#main-window:not(:-moz-lwtheme) #TabsToolbar-customization-target toolbarbutton .toolbarbutton-icon,
#main-window:not([style*='--lwt-header-image']):-moz-lwtheme:-moz-lwtheme-darktext #TabsToolbar-customization-target toolbarbutton .toolbarbutton-icon {
fill: var(--classic_squared_tabs_new_tab_icon_color) !important;
color: var(--classic_squared_tabs_new_tab_icon_color) !important;
}
/* move caption buttons to windows top right position */
#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
position: fixed;
right: 0;
visibility: visible;
display: flex;
}
/* caption button position in maximized mode after moving to the top */
#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container,
#main-window[tabsintitlebar][sizemode="maximized"]:not([inDOMFullscreen="true"]) #TabsToolbar .titlebar-buttonbox-container {
top: -14px;
}
/* Windows */
@media (-moz-os-version:windows-win10), (-moz-os-version:windows-win8), (-moz-os-version:windows-win7) {
#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
top: 10px;
}
#main-window[tabsintitlebar][sizemode="maximized"]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
top: 8px;
}
}
/* Windows 7 extra tweaks */
@media (-moz-os-version: windows-win7) {
@media all and (-moz-windows-compositor) {
#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
display: none;
}
}
@media not all and (-moz-windows-compositor) {
#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
top: -2px !important;
}
#main-window[tabsintitlebar][sizemode="maximized"]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
top: 0px !important;
}
#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) #toolbar-menubar[autohide="true"]:not([inactive="true"]) ~ #TabsToolbar .titlebar-buttonbox-container {
display: none !important;
}
}
}
/* Windows 10 extra tweaks */
@media (-moz-os-version: windows-win10) {
#main-window:not([tabsintitlebar]) menubar > menu:not(:-moz-lwtheme):hover:not([disabled="true"]),
#main-window:not([tabsintitlebar]) menubar > menu:not(:-moz-lwtheme)[_moz-menuactive="true"]:not([disabled="true"]) {
background-color: Highlight !important;
color: HighlightText !important;
}
}
/* tweaks for fullscreen mode */
#main-window[tabsintitlebar][sizemode="fullscreen"] #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container,
#main-window[tabsintitlebar][sizemode="fullscreen"] #navigator-toolbox #PanelUI-button,
#main-window #TabsToolbar #window-controls {
display: none !important;
}
/* hide non-required items */
#TabsToolbar .private-browsing-indicator,
#TabsToolbar #window-controls,
#TabsToolbar *[type="caption-buttons"],
#TabsToolbar *[type="pre-tabs"],
#TabsToolbar *[type="post-tabs"] {
display: none !important;
}
/* adjust tabs toolbar padding */
#main-window:-moz-any([sizemode="normal"],[sizemode="maximized"],[sizemode="fullscreen"]) #navigator-toolbox #toolbar-menubar[autohide="true"][inactive="true"] ~ #TabsToolbar,
#main-window[tabsintitlebar]:-moz-any([sizemode="normal"],[sizemode="maximized"],[sizemode="fullscreen"]) #navigator-toolbox #toolbar-menubar[autohide="true"][inactive="true"] ~ #TabsToolbar,
#main-window:-moz-any([sizemode="normal"],[sizemode="maximized"],[sizemode="fullscreen"]) #navigator-toolbox #TabsToolbar,
#main-window[tabsintitlebar]:-moz-any([sizemode="normal"],[sizemode="maximized"],[sizemode="fullscreen"]) #navigator-toolbox #TabsToolbar {
-moz-padding-start: 0px !important;
-moz-margin-start: 0px !important;
}
/* hide line above navigation toolbar appearing in some cases */
#main-window:not([tabsintitlebar]) #nav-bar,
#main-window:not([tabsintitlebar]) #navigator-toolbox {
border-top: 0 !important;
box-shadow: unset !important;
}
/* disable Mozillas tab jumping nonsense when moving tabs
#navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
padding-bottom: unset !important;
}
#navigator-toolbox[movingtab] #tabbrowser-tabs {
padding-bottom: unset !important;
margin-bottom: unset !important;
}
#navigator-toolbox[movingtab] > #nav-bar {
margin-top: unset !important;
}*/
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group: 10 !important;}
#TabsToolbar {-moz-box-ordinal-group: 1000 !important;}
#TabsToolbar {display: block !important;position: absolute !important;bottom: 0 !important;}
#tabbrowser-tabs {width: 100vw !important;}
#navigator-toolbox {padding-bottom: calc(var(--tab-min-height) - 1px);}
/* size of new tab tabs '+' icon */
.tabs-newtab-button .toolbarbutton-icon {
padding: 0px !important;
margin: 0px !important;
width: 18px !important;
height: 14px !important;
}
scrollbox {
-moz-box-pack: center !important;
}
/*Lesezeichenbild + Favicon ausblenden -> Lesezeichen hinzufügen/bearbeiten */
#editBookmarkPanelImage, #editBookmarkPanelFaviconContainer {
visibility: collapse;
}
#editBookmarkPanelInfoArea {
display: none !important;
}
/*Mindesthöhe Lesezeichenordner Liste anpassen -> Lesezeichen hinzufügen/bearbeiten*/
/*Mindesthöhe in Px -> hier Platz für 12 Ordnereinträge*/
#editBMPanel_folderTree {
min-height: 540px !important;
}
menu.bookmark-item, menuitem.bookmark-item {
max-width: 16em ! important;
}
#restore-lastsession {
fill: red !important;
}
Alles anzeigen
sodele, nach etlichen schwierigkeiten hab ich dank dieses forums die tabs wieder unten.
das einzige, was mich stört, ist die fette schrift, und die farbe des aktiven tab. kann man dieses grau etwas aufhellen? ich kenn leider diese farbbezeichnungen nicht. kann man evtl n trennung zwischen den einzelnen tabs einbaun? dieser fliessende übergang ist nicht sonderlich prickelnd.
danke schon mal für eure aufmerksamkeit und hilfe.
meine aktuelle css:
@-moz-document url(chrome://browser/content/browser.xhtml) {
#TabsToolbar {
background: #dbdfeb !important;
position: absolute !important;
display: block !important;
top: 107px !important; /*Abstand nach oben*/
width: 100% !important;
}
#TabsToolbar :-moz-any(.tabs-newtab-button,#tabs-newtab-button) {
min-width: 0px !important;
width: 25px !important;
margin-bottom: -5px !important;
}
#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {
padding-bottom: 50px !important;
}
:root {
--tab-min-height: 30px !important; /* 30 25 20*/
}
:root #tabbrowser-tabs {
--tab-min-height: 20px !important; /* 30 25 15*/
}
.tabbrowser-tab:not([selected="true"]) {
color: black !important;
background: lightgrey !important;
font-weight: bold !important;
}
/* Aktiver Tab */
.tabbrowser-tab[selected] .tab-content {
color: black !important;
background: grey !important;
font-weight: bold !important;
}
.tabbrowser-tab:not([pinned]) {
-moz-box-flex: 0!important;
width: 157px!important;
}
}
Alles anzeigen
edit: habs dank tante google hinbekommen. das helle grau heisst very light grey, und die nicht fette schriftart nennt sich normal.
jetzt wären nur noch abgegrenzte tabs gefragt
jetzt schauts so aus:
sodass die Menüleiste ganz zu sehen ist
Das liegt aber nicht am CSS von reddit, sondern am Rest, den du nutzt und den ich nicht kenne. Falls du bereits ein Thema zu deinem CSS hast, bitte verlinken, ansonsten bitte ein eigenes neues Thema zu starten, das geht hier sonst unter und verwirrt andere, danke.
Aber ich habe nur diesen einen Code in meinem userChrome.css!
Oben in der Datei steht noch:
/* 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");
Doch glaube ich, das stand da immer schon???
Dein Bild von heute zeigt wesentlich mehr Änderungen als die im CSS von reddit. Dazu bitte den Code/das CSS oder den Namen vom genutzten Thema. Sollte es ein Thema sein, bitte den Autor kontaktieren, dann ist es nicht Proton-kompatiblel. Hatte ich heute schon mal geschrieben, dass diverse Themen dahingehend nicht kompatibel sind und das man die Ursache dann dort ändern müsste, weil die es a) am besten kennen und b) dafür verantwortlich sind. Bei der vielen Menge an Themen sind Insellösungen mit so einer Unbekannten schlichtweg nicht schaffbar.
Ja! Code ist identisch mit dem aus meinem Beitrag #122
Verglichen mit deinem, sind noch zwei Zeilen Code hinzugefügt als "Patch", damit genau das Problem den Leerzeilen nicht mehr auftritt. Danach sollte es perfekt sein.
Hey jullem, mit diesen zwei zusätzlichen Zeilen ist es perfekt. Vielen Dank für deine tolle Hilfe.
Hallo zusammen,
Dank des Codes von Jullem habe ich die Tableiste auch wieder da, wo ich sie haben will - 1000 Dank fürs Teilen!
Zwei kleine Schönheitsfehler würde ich gern ausmerzen:
- Den kleinen Spalt unter den Tabs (hab zwar hier Beiträge dazu gefunden, weiß aber leider nicht, wo ich was ändern muss)
- Die durchgezogene Linie unter der Menüleiste
Wäre super, wenn mir jemand einen Tipp geben könnte!
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/
/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/
:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}
:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }
#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }
#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }
.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }
#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}
.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }
@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }
/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */
:root{ --uc-window-control-width: 0px !important }
#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }
#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}
#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }
#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}
#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }
#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }
/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/
--tab-min-width: 80px !important; /*adjust to set width or omit to use default*/
#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}
.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}
.tab-close-button {
color: red!important;
}
Alles anzeigen
Dein Bild von heute zeigt wesentlich mehr Änderungen als die im CSS von reddit. Dazu bitte den Code/das CSS oder den Namen vom genutzten Thema. Sollte es ein Thema sein, bitte den Autor kontaktieren, dann ist es nicht Proton-kompatiblel. Hatte ich heute schon mal geschrieben, dass diverse Themen dahingehend nicht kompatibel sind und das man die Ursache dann dort ändern müsste, weil die es a) am besten kennen und b) dafür verantwortlich sind. Bei der vielen Menge an Themen sind Insellösungen mit so einer Unbekannten schlichtweg nicht schaffbar.
Ich benutze das dunkle Theme, das bei Firefox dabei ist (Autor: Mozilla/Version 1.2) und in der userChrome.css steht folgendes (Code von #122 und die 4 Zeilen aus meinem letzten Post):
/* 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.
*/
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/
/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/
:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}
:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }
#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }
#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }
.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }
#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}
.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }
@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }
/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */
:root{ --uc-window-control-width: 0px !important }
#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }
#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}
#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }
#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}
#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }
#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }
/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/
--tab-min-width: 80px !important; /*adjust to set width or omit to use default*/
#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}
.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}
.tab-close-button {
color: red!important;
}
Alles anzeigen
Das wird jetzt schwierig, wenn das CSS nicht mal fehlerfrei ist.
ZitatAlles anzeigen50:11 Expected LPAREN but found '-moz-bool-pref('.error
50:11 Unexpected '-moz-bool-pref('.
50:26 Unexpected '"layout.css.osx-font-smoothing.enabled"'.
50:65 Unexpected ')'.
50:66 Unexpected '{'.
53:1Unexpected '}'.115:1 Expected RBRACE but found '#tabbrowser-tabs
Entweder ist was in Zeile 50/51 falsch oder es fehlt was. Dahingehend ist auch schon das Original (von reddit geholt via pastebin) fehlerhaft, ist mir vorhin nicht aufgefallen. Es fehlt eine Klammer: }
Entweder ist was in Zeile 50/51 falsch oder es fehlt was.
Dein Tool kennt einfach nur nicht diese Syntax. Der Code an dieser Stelle ist korrekt. Diese Syntax wird nur von Firefox und nur für Firefox unterstützt, ist dementsprechend kein Teil eines Webstandards und wird darum von keinem gängigen Tool erkannt.
Freunde,
wieso ändert sich der tab position wenn von Vollbild ins normal verkleinere..
Vollbild und Fenstermodus
habe ich was falsch gemacht ?
Vielen Dank im voraus
Hallo 2002Andreas!
Bin neu hier, erstmal Danke für deinen neuen CSS - Code für FX 89. Hab ihn bereits kopiert aber......
Vielleicht Kannst du mir helfen Habe ein Problem wenn ich mehr als 6 Tabs öffne fängt die ganz Tab Reihe an zu zucken erst wenn ich mehrere Tabs lösche und nur 6 Tabs übrigbleiben ist alles wieder ruhig... STRANGE was ist das, hier mein CSS Code:
/*Eigene Farbe für besuchte Links*/
a:visited{color:#FF0000 !important;}
#TabsToolbar {
position: absolute !important;
display: block !important;
top: 104px !important; /*Abstand nach oben*/
width: 100% !important;
}
.tabbrowser-tab {
margin-top: 2px !important;
max-height: 37px !important;
}
#TabsToolbar :-moz-any(.tabs-newtab-button,#tabs-newtab-button) {
min-width: 0px !important;
width: 25px !important;
margin-bottom: -5px !important;
}
#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {
padding-bottom: 34px !important;
}
/* TABS: height */
:root {
--tab-toolbar-navbar-overlap: 0px !important;
--tab-min-height: 27px !important; /* adjust to suit your needs */
}
:root #tabbrowser-tabs {
--tab-min-height: 27px !important; /* needs to be the same as above under :root */
--tab-min-width: 70px !important;
Hast du eine Idee was hier falsch ist , Danke BooBooBlue
Hast du eine Idee was hier falsch ist
Hallo und Willkommen hier im Forum. 😊
Das Problem haben einige andere user auch, nur ich kann es nicht bestätigen bzw. nachvollziehen
Hier habe ich 55 Tabs offen, und da zuckt nichts.
Hallo Andreas!
Hab mir jetzt diese Variante zusammengeflickt alles intuitiv kenn mich überhaubt nicht aus mit dem erstellen von css-codes, jetzt zuckt nichts mehr- funktioniert, einzige Frage wie kann ich die Tabhöhe verkleinern, schmäler sieht elganter aus. Danke
Hier der neue Code:
/* Source file https://github.com/MrOtherGuy/fir…s_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/
/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/
:root{ --uc-titlebar-padding: 0px; }
Media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}
:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }
#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }
#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }
.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }
#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}
.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }
Media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }
/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }
/* Source file https://github.com/MrOtherGuy/fir…n_top_patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */
:root{ --uc-window-control-width: 0px !important }
#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }
#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}
#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }
#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}
#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }
#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }
margin-top: 2px !important;
max-height: 37px !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}
.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}
.tab-close-button {
color: red!important;
}
Herzlichen Gruß
BooBooBlue
Hi,
eventuell ist mein Beitrag #148 untergegangen?!
Wäre wirklich super, wenn mir jemand helfen könnte!
Alles anzeigenHallo zusammen,
Dank des Codes von Jullem habe ich die Tableiste auch wieder da, wo ich sie haben will - 1000 Dank fürs Teilen!
Zwei kleine Schönheitsfehler würde ich gern ausmerzen:
- Den kleinen Spalt unter den Tabs (hab zwar hier Beiträge dazu gefunden, weiß aber leider nicht, wo ich was ändern muss)
- Die durchgezogene Linie unter der Menüleiste
Wäre super, wenn mir jemand einen Tipp geben könnte!
CSS Alles anzeigen/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Modify to change window drag space width */ /* Use tabs_on_bottom_menubar_on_top_patch.css if you have menubar permanently enabled and want it on top */ /* IMPORTANT */ /* Get window_control_placeholder_support.css Window controls will be all wrong without it. Additionally on Linux, you may need to get: linux_gtk_window_control_patch.css */ :root{ --uc-titlebar-padding: 0px; } @media (-moz-os-version: windows-win10){ :root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px } } #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, #TabsToolbar > .titlebar-buttonbox-container{ position: fixed; display: block; top: var(--uc-titlebar-padding,0px); right:0; height: 40px; } /* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ :root{ --uc-titlebar-padding: 0px !important } .titlebar-buttonbox-container{ left:0; right: unset !important; } } :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px } #toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 } #navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; } .titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; } #titlebar{ -moz-box-ordinal-group: 2; -moz-appearance: none !important; --tabs-navbar-shadow-size: 0px; } .titlebar-placeholder, #TabsToolbar .titlebar-spacer{ display: none; } /* Also hide the toolbox bottom border which isn't at bottom with this setup */ #navigator-toolbox::after{ display: none !important; } @media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } } /* These exist only for compatibility with autohide-tabstoolbar.css */ toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; } #navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 } /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */ :root{ --uc-window-control-width: 0px !important } #navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important } #toolbar-menubar{ position: fixed; display: flex; top: var(--uc-titlebar-padding,0px); height: 29px; width: 100%; overflow: hidden; } #toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; } #toolbar-menubar > [flex]{ flex-grow: 100; } #toolbar-menubar > spacer[flex]{ order: 99; flex-grow: 1; min-width: var(--uc-window-drag-space-width,20px); } #toolbar-menubar .titlebar-button{ padding: 2px 17px !important; } #toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px } /* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/ --tab-min-width: 80px !important; /*adjust to set width or omit to use default*/ #tabbrowser-tabs { width: 100vw !important; } #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;} .tab-background { border-radius: 8px 8px 0px 0px !important; border-image: none !important; } .tab-line { display: none; } .tab-close-button { color: red!important; }
wenn mir jemand helfen könnte!
Teste bitte.
Tachchen Community,
ich bin auch neu hier und eigentlich jedes Mal, wenn ein neuer FF released wird, auf dieser Seite hier, um nach einer neuen userChrome.css zu suchen, welche die Tableiste wieder nach oben befördert. Zwar kann ich nicht ganz nachvollziehen, warum das Mozilla nicht grundsätzlich mit einem "Schalter" anbietet, aber ich bin froh, dass ihr jedes Mal innerhalb von wenigen Stunden nach dem Release eine Lösung parat habt!! Thx@all!!
Eine Frage hätte ich jedoch noch:
Ich habe jetzt den Code, der zuletzt von Gabinski gepostet wurde, übernommen und bin sehr zufrieden.
Allerdings würde ich mich über eine Kleinigkeit freuen:
Wenn man viele Tabs offen hat (25++), werden die einzelnen Tabs immer kleiner von der Breite her, je mehr Tabs man zusätzlich öffnet.
Zuletzt ist die Breite meiner Tabs immer gleich geblieben, jedoch konnte ich mit dem Mausrad zwischen den Tabs hin und her scrollen, wenn mehr Tabs aktiv waren, als es die Bildschirmbreite zuließ.
Hat jemand einen Tipp, wie ich das wieder verwirklichen könnte?
Besten Dank für eure Mühe.
Gruß netrocker
ist die Breite meiner Tabs immer gleich geblieben,
Hallo und Willkommen hier im Forum. 😊
Teste bitte:
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/
/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/
.tabbrowser-tab:not([pinned]) {
-moz-box-flex: 0 !important;
width: 155px !important;
}
:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}
:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }
#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }
#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }
.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }
#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}
.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }
@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }
/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */
:root{ --uc-window-control-width: 0px !important }
#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }
#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}
#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }
#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}
#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }
#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }
/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/
--tab-min-width: 80px !important; /*adjust to set width or omit to use default*/
#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}
.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}
.tab-close-button {
color: red!important;
}
Alles anzeigen
In Zeile 20 kannst du den Wert für dich ändern.
wenn mir jemand helfen könnte!
Teste bitte.
Hallo Andreas,
lieben Dank für Deine Antwort.
Leider verändert sich nichts - der kleine Spalt unter den Tabs ist geblieben, und auch die durchgezogene Linie unter der Menübar ist noch da.
Hatte Deinen Code als einzelne .css angelegt, und im nächsten Versuch in meine bestehende eingefügt. Hat bei beidem nicht funktioniert.
der kleine Spalt unter den Tabs ist geblieben, und auch die durchgezogene Linie unter der Menübar ist noch da.
Sorry, meine Antwort ist im falschen Thread gelandet.
Ansonsten, welches Theme benutzt du denn?
Für die Tableiste, teste bitte mal: