Tìm kiếm hỗ trợ

Tránh các lừa đảo về hỗ trợ. Chúng tôi sẽ không bao giờ yêu cầu bạn gọi hoặc nhắn tin đến số điện thoại hoặc chia sẻ thông tin cá nhân. Vui lòng báo cáo hoạt động đáng ngờ bằng cách sử dụng tùy chọn "Báo cáo lạm dụng".

Learn More

Chủ đề này đã đóng và được lưu lại. Vui lòng hỏi một câu hỏi mới nếu bạn cần giúp đỡ.

Tabs on Bottom

  • 24 trả lời
  • 7 gặp vấn đề này
  • 1 lượt xem
  • Trả lời mới nhất được viết bởi cor-el

more options

Hi

Running Firefox 71.0 (64 bit)

Well seems Firefox has been messing this up again.

Anyone have the new work around solution to get my tabs back on the bottom again. They were fine this morning then shut down and went out to lunch and when I came back they were back on the top again after months of being where I wanted them below my bookmark bar.

Thoughts on this?

Thanks Dave

Hi Running Firefox 71.0 (64 bit) Well seems Firefox has been messing this up again. Anyone have the new work around solution to get my tabs back on the bottom again. They were fine this morning then shut down and went out to lunch and when I came back they were back on the top again after months of being where I wanted them below my bookmark bar. Thoughts on this? Thanks Dave

Giải pháp được chọn

Hi.

You can move the CSS code for tabs on bottom that works in Firefox71 to its own file (e.g. tabs-on-bottom.css). Do NOT place the default @namespace line at the top of this tabs-on-bottom.css file. Add a line above the @namespace line in userChrome.css to import this file. If you do not have other CSS code in userChrome.css then you can consider to keep the code in userChrome.css and only remove the @namespace line.

See also:

You need to remove this line in Firefox 108 and newer.

#tabbrowser-tabs { width: 100vw !important; }

userChrome.css:

@import url("tabs-on-bottom.css");
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

Place this code in tabs-on-bottom.css code updated for for Firefox 108+.

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

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

/* https://searchfox.org/mozilla-release/source/browser/themes/shared/tabs.inc.css */
/* https://github.com/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="true"] ~
 #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*/
}
Đọc câu trả lời này trong ngữ cảnh 👍 1

Tất cả các câu trả lời (4)

more options

rosawood said

olds97_lss said
And now with 72... it's broken again.

You'd think that with being a continual irritant to so many people, this would be checked before a release. Does Mozilla do any integration testing? Or do the developers just figure eventually they'll wear us down? I just don't get why this has to be an issue with every release. ...

You would think that when "Tabs on Bottom" gets broken with every new version (recently) that users who insist on modifying Firefox via userChrome.css would learn to expect this to happen.

Mozilla is slowly rewriting XUL into XHTML for the the user interface in 'baby steps'; the developers manage to "break" the tab-strip code frequently.

Try using this reddit - https://www.reddit.com/r/FirefoxCSS/ - for the latest "fixes" for what ails your Firefox userChrome.css modifications.

more options

You only need to remove the @namespace that is at the top of userChrome.css or move it below the tabs on bottom code or move the tabs on bottom code to a separate file. At least that works for me.

See my reply in this thread on page one.

more options

I've updated the code in my reply on page one. After some testing I found that all that is needed to make the code work again is to replace :root in rules by *|*:root. I had other code that was broken as well and noticed some *|*:root selectors in the Browser Toolbox, so gave that a try for this code and it worked.

more options

I've updated the code to make it work in Firefox 108 and newer and make the "List All Tabs" and "New Tab" buttons appear properly. This involves removing (commenting out) this line:

#tabbrowser-tabs { width: 100vw !important; }
  1. 1
  2. 2