Tabs on bottom is Tabs below URL and Bookmarks multi line?

1 yanıt
0 kişi bu sorunu yaşıyor
1 gösterim
Son yanıtı yazan: cor-el

2 yıl önce

8.10.2022 02:12

Besides old content from 2017 where is the most current listing of Tabs below the URL and below the Multi Bookmarks lines. I have the code inserted in the CSS code after the code for the Multi bookmarks section. So, why is the Tabs showing up at the bottom of the screen. Can someone point me to the right version of tabs? I'm on 105.0.2 10-8-22

/* TABS: bottom - Firefox 65 and newer; should for now work with XUL @namespace */
/*  https://support.mozilla.org/en-US/questions/1274416  Github  10/8/22  */
@import url("tabs-on-bottom.css");
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

tabs-on-bottom.css working code for Firefox 71 posted in this thread.

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* TABS: below navbar - Firefox 65-89+,95+,106+,108+ */

/* #SXRR#/source/browser/themes/shared/tabs.inc.css */
/* #GHC#/Aris-t2/CustomCSSforFx/blob/master/classic/css/tabs/tabs_below_navigation_toolbar_fx89.css */

/* ROOT: VARS */
*|*:root {
  --tab-toolbar-navbar-overlap: 0px !important;

  --tab-min-height: 26px !important;
  --tab-min-width:  60px !important; /*minimum:50px*/
/*  --tab-overflow-pinned-tabs-width: 175px */

  --tabbar-adjust:  0px;
  --tabbar-caption: 0px;

  --tabbar-caption-padding:  90px;
  --tabbar-controls-padding: 90px;
}

/* TABS: below nav-bar */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group: 10 !important;}
#TabsToolbar {-moz-box-ordinal-group: 1000 !important;}

/* TABS: POSITION */
#TabsToolbar {
  display: block !important;
  position: absolute !important;
  bottom: 0;
  width: 100vw !important;
}

/* Firefox 107 and older *//* #tabbrowser-tabs { width: 100vw !important; } */

/* navigator-toolbox: PADDING */
*|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {
  position: relative !important; /*89*/
  padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*ADJUST*/
  background-color: var(--toolbar-bgcolor) !important;
}

/* TABS: menubar,titlebar hidden - 65-73 *//*
*|*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"])
 #toolbar-menubar[autohide="true"] ~ #TabsToolbar{
  bottom: var(--tabbar-adjust) !important; /*ADJUST*/
}
*/

/* TABS: HEIGHT */
#tabbrowser-tabs,
#xtabbrowser-arrowscrollbox,
#xtabbrowser-tabs .tabbrowser-tab {
  min-height: var(--tab-min-height) !important;
  max-height: var(--tab-min-height) !important;
}

#tabbrowser-tabs,
.tab-stack,
.tab-content {
  height: var(--tab-min-height) !important;
}

/* TABS: APPEARANCE */
#TabsToolbar {
  height: var(--tab-min-height) !important;
  margin-bottom: 1px !important;
  box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /*OPTIONAL*/
  background-color: var(--toolbar-bgcolor) !important;
  color: var(--toolbar-color) !important;
}

/* DRAG SPACE */
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
  width: 20px !important;
}

/* TABS: movingtab - vertical shifts */
#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;
}

/* INDICATORS - POSITION */
*|*:root[privatebrowsingmode=temporary] .private-browsing-indicator {
  display: block !important;
  position: absolute !important;
  bottom: 0px !important;
  right: 0px !important;
  width: 14px !important;
  pointer-events: none !important;
}

/* INDICATORS - HIDE */
*|*:root:not([accessibilitymode])             .accessibility-indicator    {display: none !important}
*|*:root:not([privatebrowsingmode=temporary]) .private-browsing-indicator {display: none !important}

/* If you want to have the caption buttons visible on the Tab bar with the Menu bar and Title bar hidden then use this code as a start to replace the above posted "caption buttons - hide" rule. The caption button are positioned absolutely via a top property, so this is affected by the Bookmarks Toolbar (PersonalToolbar) being visible or hidden. Use either of the two "--personal-toolbar-height" settings that apply to the state (collapsed/hidden) of the Bookmarks Toolbar. */

/* caption buttons - PersonalToolbar hidden/visible */
*|*:root {
 --personal-toolbar-height: 0px !important;   /*PersonalToolbar hidden*/
 --personal-toolbar-height: 24px !important;  /*PersonalToolbar visible*/
 --caption-buttons-adjust: -12px !important;  /*caption buttons - vertical adjustment*/
}

*|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="false"]
 ~ #TabsToolbar .titlebar-buttonbox-container {
  position: fixed !important;
  display: block !important;
  right: 0 !important;
  top: calc(var(--tab-min-height) + var(--personal-toolbar-height) + var(--caption-buttons-adjust));
  visibility: visible !important;
  height: var(--tab-min-height) !important;
}

/* caption buttons - HEIGHT and WIDTH */
.titlebar-buttonbox-container toolbarbutton {
  height: var(--tab-min-height) !important;
  margin: 0px -5px 0px -5px !important;
  padding: 0 !important;
}

/* caption buttons - PADDING - reserve space on Tab bar */
*|*:root[tabsintitlebar]:not([inFullscreen="true"])
 #toolbar-menubar[autohide="true"] ~
  #TabsToolbar {
   padding-right: 100px !important; /*adjust*/
}

Besides old content from 2017 where is the most current listing of Tabs below the URL and below the Multi Bookmarks lines. I have the code inserted in the CSS code after the code for the Multi bookmarks section. So, why is the Tabs showing up at the bottom of the screen. Can someone point me to the right version of tabs? I'm on 105.0.2 10-8-22 <pre><nowiki> /* TABS: bottom - Firefox 65 and newer; should for now work with XUL @namespace */ /* https://support.mozilla.org/en-US/questions/1274416 Github 10/8/22 */ @import url("tabs-on-bottom.css"); @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */</nowiki></pre><br> tabs-on-bottom.css working code for Firefox 71 posted in this thread. <pre><nowiki>@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* TABS: below navbar - Firefox 65-89+,95+,106+,108+ */ /* #SXRR#/source/browser/themes/shared/tabs.inc.css */ /* #GHC#/Aris-t2/CustomCSSforFx/blob/master/classic/css/tabs/tabs_below_navigation_toolbar_fx89.css */ /* ROOT: VARS */ *|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 26px !important; --tab-min-width: 60px !important; /*minimum:50px*/ /* --tab-overflow-pinned-tabs-width: 175px */ --tabbar-adjust: 0px; --tabbar-caption: 0px; --tabbar-caption-padding: 90px; --tabbar-controls-padding: 90px; } /* TABS: below nav-bar */ #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group: 10 !important;} #TabsToolbar {-moz-box-ordinal-group: 1000 !important;} /* TABS: POSITION */ #TabsToolbar { display: block !important; position: absolute !important; bottom: 0; width: 100vw !important; } /* Firefox 107 and older *//* #tabbrowser-tabs { width: 100vw !important; } */ /* navigator-toolbox: PADDING */ *|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox { position: relative !important; /*89*/ padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*ADJUST*/ background-color: var(--toolbar-bgcolor) !important; } /* TABS: menubar,titlebar hidden - 65-73 *//* *|*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar{ bottom: var(--tabbar-adjust) !important; /*ADJUST*/ } */ /* TABS: HEIGHT */ #tabbrowser-tabs, #xtabbrowser-arrowscrollbox, #xtabbrowser-tabs .tabbrowser-tab { min-height: var(--tab-min-height) !important; max-height: var(--tab-min-height) !important; } #tabbrowser-tabs, .tab-stack, .tab-content { height: var(--tab-min-height) !important; } /* TABS: APPEARANCE */ #TabsToolbar { height: var(--tab-min-height) !important; margin-bottom: 1px !important; box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /*OPTIONAL*/ background-color: var(--toolbar-bgcolor) !important; color: var(--toolbar-color) !important; } /* DRAG SPACE */ .titlebar-spacer[type="pre-tabs"], .titlebar-spacer[type="post-tabs"] { width: 20px !important; } /* TABS: movingtab - vertical shifts */ #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; } /* INDICATORS - POSITION */ *|*:root[privatebrowsingmode=temporary] .private-browsing-indicator { display: block !important; position: absolute !important; bottom: 0px !important; right: 0px !important; width: 14px !important; pointer-events: none !important; } /* INDICATORS - HIDE */ *|*:root:not([accessibilitymode]) .accessibility-indicator {display: none !important} *|*:root:not([privatebrowsingmode=temporary]) .private-browsing-indicator {display: none !important} </nowiki></pre><br> /* If you want to have the caption buttons visible on the Tab bar with the Menu bar and Title bar hidden then use this code as a start to replace the above posted "caption buttons - hide" rule. The caption button are positioned absolutely via a top property, so this is affected by the Bookmarks Toolbar (PersonalToolbar) being visible or hidden. Use either of the two "--personal-toolbar-height" settings that apply to the state (collapsed/hidden) of the Bookmarks Toolbar. */ <pre><nowiki>/* caption buttons - PersonalToolbar hidden/visible */ *|*:root { --personal-toolbar-height: 0px !important; /*PersonalToolbar hidden*/ --personal-toolbar-height: 24px !important; /*PersonalToolbar visible*/ --caption-buttons-adjust: -12px !important; /*caption buttons - vertical adjustment*/ } *|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="false"] ~ #TabsToolbar .titlebar-buttonbox-container { position: fixed !important; display: block !important; right: 0 !important; top: calc(var(--tab-min-height) + var(--personal-toolbar-height) + var(--caption-buttons-adjust)); visibility: visible !important; height: var(--tab-min-height) !important; } /* caption buttons - HEIGHT and WIDTH */ .titlebar-buttonbox-container toolbarbutton { height: var(--tab-min-height) !important; margin: 0px -5px 0px -5px !important; padding: 0 !important; } /* caption buttons - PADDING - reserve space on Tab bar */ *|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar { padding-right: 100px !important; /*adjust*/ } </nowiki></pre>

cor-el tarafından 15 Şubat 2023 07:14:12 -0800 tarihinde düzenlendi

Answer 1 · 2022-10-08 02:12:40

cor-el

Moderator
Top 10 Contributor

8.10.2022 10:32

You need to add a position: relative rule under this section:

/* navigator-toolbox: PADDING */
*|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {
  position: relative !important; /*89*/
  padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*ADJUST*/
  background-color: var(--toolbar-bgcolor) !important;
}

In 108 and newer you need to comment out this rule:

/* no longer needed in Firefox 108 and newer *//*
#tabbrowser-tabs {
 width: 100vw !important;
}*/

https://support.mozilla.org/en-US/kb/forum-response-tabs-below-url-bar

cor-el tarafından 15 Şubat 2023 07:14:12 -0800 tarihinde düzenlendi

Mozilla Destek’te Ara

Tabs on bottom is Tabs below URL and Bookmarks multi line?

Tüm Yanıtlar (1)

Ürüne göre keşfet

Konuya göre keşfet

Ürüne göre göz at

Tüm forum başlıklarına konuya göre göz at

Şunlarla ilgili yardım al:

Mozilla Destek’te Ara

Tabs on bottom is Tabs below URL and Bookmarks multi line?

Tüm Yanıtlar (1)