X
點擊此處開啟此網站的行動版。

技術支援討論區

Tabs on bottom--still no solution

已張貼

I've tried the solutions recommended in other threads, which have now been closed, removed the @namespace, tabs still on top.

Edited: I realized all the garbage in the address bar was back, so I moved the tabs on bottom code to its own file, then used the userChrome.css to make the tweaks for the address bar. Those aren't working either.

This is the code in my tabs_on_bottom.css file.

/* TABS: on bottom */

  1. navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
  2. TabsToolbar {-moz-box-ordinal-group:1000!important}
  1. TabsToolbar {
position: absolute !important; 
bottom: 0 !important;
width: 100vw !important;
display: block !important;

}

  1. tabbrowser-tabs {
 top: 300 !important;
 width: 100vw !important;

}

  1. main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {

padding-bottom: calc(1px + var(--tab-min-height_tnot)) !important; }

/* TABS: height */

root {
--tab-toolbar-navbar-overlap: 0px !important;
--tab-min-height: 33px !important; /* adjust to suit your needs */
--tab-min-height_tnot: 32px;

}

root #tabbrowser-tabs {
--tab-min-height: 33px !important; /* needs to be the same as above under :root */
--tab-min-width: 80px !important;

}

  1. TabsToolbar {

height: var(--tab-min-height) !important; margin-bottom: 1px !important; box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; background-color: var(--toolbar-bgcolor) !important; } /* hide windows-controls */

  1. TabsToolbar #window-controls {display:none!important;}

/* move caption buttons to right of Tab bar */

  1. main-window[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {

position: fixed !important; right: 0 !important; top: calc(6px + var(--tab-min-height)) !important; display: block !important; visibility: visible !important; }

  1. toolbar-menubar[autohide="true"] ~ #TabsToolbar {padding-right: 100px !important;}

Whether I import this file or put the code in the userChrome.css file, it makes no difference. I'm running FF 72.0.2.

I've tried the solutions recommended in other threads, which have now been closed, removed the @namespace, tabs still on top. Edited: I realized all the garbage in the address bar was back, so I moved the tabs on bottom code to its own file, then used the userChrome.css to make the tweaks for the address bar. Those aren't working either. This is the code in my tabs_on_bottom.css file. /* TABS: on bottom */ #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10} #TabsToolbar {-moz-box-ordinal-group:1000!important} #TabsToolbar { position: absolute !important; bottom: 0 !important; width: 100vw !important; display: block !important; } #tabbrowser-tabs { top: 300 !important; width: 100vw !important; } #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox { padding-bottom: calc(1px + var(--tab-min-height_tnot)) !important; } /* TABS: height */ :root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 33px !important; /* adjust to suit your needs */ --tab-min-height_tnot: 32px; } :root #tabbrowser-tabs { --tab-min-height: 33px !important; /* needs to be the same as above under :root */ --tab-min-width: 80px !important; } #TabsToolbar { height: var(--tab-min-height) !important; margin-bottom: 1px !important; box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; background-color: var(--toolbar-bgcolor) !important; } /* hide windows-controls */ #TabsToolbar #window-controls {display:none!important;} /* move caption buttons to right of Tab bar */ #main-window[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container { position: fixed !important; right: 0 !important; top: calc(6px + var(--tab-min-height)) !important; display: block !important; visibility: visible !important; } #toolbar-menubar[autohide="true"] ~ #TabsToolbar {padding-right: 100px !important;} Whether I import this file or put the code in the userChrome.css file, it makes no difference. I'm running FF 72.0.2.
附加的畫面擷圖

由 rosawood 於 修改

引用

額外的系統細節

應用程式

  • User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:72.0) Gecko/20100101 Firefox/72.0

更多資訊

crankygoat
  • Top 25 Contributor
40 個解決方法 471 個答案

Had you done this yet? Type about:config in the address bar and Enter. Find the preference toolkit.legacyUserProfileCustomizations.stylesheets and set it to "true".

This site keeps up with changes to the code: https://www.userchrome.org/what-is-userchrome-css.html#movetabbar

Had you done this yet? Type about:config in the address bar and Enter. Find the preference toolkit.legacyUserProfileCustomizations.stylesheets and set it to "true". This site keeps up with changes to the code: https://www.userchrome.org/what-is-userchrome-css.html#movetabbar
這篇文章有幫助嗎? 0
引用

提出問題者

I changed the value to TRUE and restarted FF, but it's still the same.

I looked at the file you linked to. Wow! I'm not sure I really understand everything that's in there.

I'm beginning to think I should just go back to 71 and stay there. The more FF is "improved", the more frustrating it gets.

I changed the value to TRUE and restarted FF, but it's still the same. I looked at the file you linked to. Wow! I'm not sure I really understand everything that's in there. I'm beginning to think I should just go back to 71 and stay there. The more FF is "improved", the more frustrating it gets.

由 rosawood 於 修改

這篇文章有幫助嗎?
引用
cor-el
  • Top 10 Contributor
  • Moderator
17768 個解決方法 160708 個答案

Try the code I posted in this reply


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

/* TABS: on bottom - code for Firefox 66-73 */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#TabsToolbar {-moz-box-ordinal-group:1000!important}

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

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

/* navigator-toolbox - padding */
*|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {
  padding-bottom: calc(var(--tab-min-height) + 0px) !important; /*adjust*/
}

/* TabsToolbar with menubar and titlebar hidden - not needed in Firefox 74 */
*|*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"])
 #toolbar-menubar[autohide="true"] ~ #TabsToolbar{
  bottom: var(--tab-min-height) !important;
  padding-top: calc(var(--tab-min-height) - 22px) !important; /*adjust*/
}

/* TABS: height */
*|*:root {
 --tab-toolbar-navbar-overlap: 0px !important;
 --tab-min-height: 33px !important; /* adjust to suit your needs */
 --tab-min-width:  80px !important; /* adjust to suit your needs */
}

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

#tabbrowser-tabs,
#tabbrowser-tabs > .tabbrowser-arrowscrollbox,
.tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {
  min-height: var(--tab-min-height) !important;
  max-height: var(--tab-min-height) !important;
}

/* drag space */
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
  width: 40px;
}

/* Override vertical shifts when moving a tab */
#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;
}

/* hide window-controls */
#TabsToolbar #window-controls {display:none!important;}

/* move caption buttons to right end of Tab bar with menu bar and title bar hidden */
*|*:root[tabsintitlebar]:not([inFullscreen="true"])
 #toolbar-menubar[autohide="true"] ~ #TabsToolbar
 .titlebar-buttonbox-container {
  position: fixed !important;
  display: block !important;
  right: 0 !important;
  top: calc(6px + var(--tab-min-height)) !important; /*adjust*/
  visibility: visible !important;
}

*|*:root[tabsintitlebar]:not([inFullscreen="true"])
 #toolbar-menubar[autohide="true"] ~  #TabsToolbar {
   padding-right: 100px !important; /*adjust*/
}
Try the code I posted in this reply *https://support.mozilla.org/en-US/questions/1276985#answer-1280813 ---- <pre><nowiki>@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */ /* TABS: on bottom - code for Firefox 66-73 */ #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10} #TabsToolbar {-moz-box-ordinal-group:1000!important} #TabsToolbar { position: absolute !important; bottom: 0 !important; width: 100vw !important; display: block !important; } #tabbrowser-tabs { width: 100vw !important; } /* navigator-toolbox - padding */ *|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox { padding-bottom: calc(var(--tab-min-height) + 0px) !important; /*adjust*/ } /* TabsToolbar with menubar and titlebar hidden - not needed in Firefox 74 */ *|*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar{ bottom: var(--tab-min-height) !important; padding-top: calc(var(--tab-min-height) - 22px) !important; /*adjust*/ } /* TABS: height */ *|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 33px !important; /* adjust to suit your needs */ --tab-min-width: 80px !important; /* adjust to suit your needs */ } #TabsToolbar { height: var(--tab-min-height) !important; margin-bottom: 0px !important; box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /* omit */ background-color: var(--toolbar-bgcolor) !important; color: var(--toolbar-color) !important; } #tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox, .tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] { min-height: var(--tab-min-height) !important; max-height: var(--tab-min-height) !important; } /* drag space */ .titlebar-spacer[type="pre-tabs"], .titlebar-spacer[type="post-tabs"] { width: 40px; } /* Override vertical shifts when moving a tab */ #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; } /* hide window-controls */ #TabsToolbar #window-controls {display:none!important;} /* move caption buttons to right end of Tab bar with menu bar and title bar hidden */ *|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container { position: fixed !important; display: block !important; right: 0 !important; top: calc(6px + var(--tab-min-height)) !important; /*adjust*/ visibility: visible !important; } *|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar { padding-right: 100px !important; /*adjust*/ } </nowiki></pre>
這篇文章有幫助嗎? 0
引用
malaus1 1 個解決方法 33 個答案

Tried just about everything on the web for userChrome.css but nothing works. Bloody Mozilla have to come up with a simple solutions or make the default as tabs on bottom.

Tried just about everything on the web for userChrome.css but nothing works. Bloody Mozilla have to come up with a simple solutions or make the default as tabs on bottom.
這篇文章有幫助嗎?
引用
cor-el
  • Top 10 Contributor
  • Moderator
17768 個解決方法 160708 個答案

Hi malaus1

Is userChrome.css working at all?

In Firefox 69 and later you need to set this pref to true on the about:config page to enable userChrome.css and userContent.css in the chrome folder.

  • toolkit.legacyUserProfileCustomizations.stylesheets = true

See:

The above posted code should at least move the Tab bar to the down position.

Hi malaus1 Is userChrome.css working at all? In Firefox 69 and later you need to set this pref to true on the <b>about:config</b> page to enable userChrome.css and userContent.css in the chrome folder. *toolkit.legacyUserProfileCustomizations.stylesheets = true See: *https://www.userchrome.org/firefox-changes-userchrome-css.html The above posted code should at least move the Tab bar to the down position.
這篇文章有幫助嗎? 0
引用
malaus1 1 個解決方法 33 個答案

Yep. Tried everything suggested including the reset to true. Nothing changes so have no idea if it even knows if userChrome.css exists.

Yep. Tried everything suggested including the reset to true. Nothing changes so have no idea if it even knows if userChrome.css exists.
這篇文章有幫助嗎?
引用
cor-el
  • Top 10 Contributor
  • Moderator
17768 個解決方法 160708 個答案

Can you post the full file path to userChrome.css to verify that the file is in the correct location (chrome folder in the profile folder) ?

Did you verify that the file is a CSS file and not a text file with a possible hidden .txt file extension (userChrome.css.css or userChrome.css.txt) ?

You can use the button on the "Help -> Troubleshooting Information" (about:support) page to go to the current Firefox profile folder or use the about:profiles page.

Can you post the full file path to userChrome.css to verify that the file is in the correct location (chrome folder in the profile folder) ? Did you verify that the file is a CSS file and not a text file with a possible hidden .txt file extension (userChrome.css.css or userChrome.css.txt) ? You can use the button on the "Help -> Troubleshooting Information" (about:support) page to go to the current Firefox profile folder or use the <b>about:profiles</b> page. *Help -> Troubleshooting Information -> Profile Folder/Directory:<br>Windows: Open Folder; Linux: Open Directory; Mac: Show in Finder *https://support.mozilla.org/en-US/kb/Profiles

由 cor-el 於 修改

這篇文章有幫助嗎?
引用
malaus1 1 個解決方法 33 個答案

The bloody thing was working fine until the last update to FF so all should be good. Heres the path C:\Users\Mal\AppData\Roaming\Mozilla\Firefox\Profiles\chrome and the image is what is in the Chrome folder showing some older files renamed to exclude them.

The bloody thing was working fine until the last update to FF so all should be good. Heres the path C:\Users\Mal\AppData\Roaming\Mozilla\Firefox\Profiles\chrome and the image is what is in the Chrome folder showing some older files renamed to exclude them.
這篇文章有幫助嗎?
引用
cor-el
  • Top 10 Contributor
  • Moderator
17768 個解決方法 160708 個答案

That is the wrong location:

  • C:\Users\Mal\AppData\Roaming\Mozilla\Firefox\Profiles\chrome

You should create the chrome folder within the actual profile folder with the random name (xxxxxxxx.default-release).

  • C:\Users\<user>\AppData\Roaming\Mozilla\Firefox\Profiles\<profile>\chrome
That is the wrong location: *C:\Users\Mal\AppData\Roaming\Mozilla\Firefox\Profiles\chrome You should create the chrome folder within the actual profile folder with the random name (xxxxxxxx.default-release). *C:\Users\&lt;user&gt;\AppData\Roaming\Mozilla\Firefox\Profiles\&lt;profile&gt;\chrome
這篇文章有幫助嗎?
引用
malaus1 1 個解決方法 33 個答案

What is the extra <profile> supposed to be? I assume it's the (xxxxxxxx.default-release) you refer to which just confused me, and why did it work before? The Chrome folder is definitaly in the Profile folder so do I create another folder of some sort? Excuse my delayed replies - I'm travelling at the moment.

What is the extra <profile> supposed to be? I assume it's the (xxxxxxxx.default-release) you refer to which just confused me, and why did it work before? The Chrome folder is definitaly in the Profile folder so do I create another folder of some sort? Excuse my delayed replies - I'm travelling at the moment.
這篇文章有幫助嗎?
引用
crankygoat
  • Top 25 Contributor
40 個解決方法 471 個答案

有幫助的回覆

The <profile> indeed refers to an actual profile folder inside \Profiles with a name like xxxxxxxx.default-release

Your mentioning C:\Users\Mal\AppData\Roaming\Mozilla\Firefox\Profiles\chrome suggests \chrome is in the wrong directory.

So, C:\Users\<user>\AppData\Roaming\Mozilla\Firefox\Profiles\xxxxxxxx.default-release\chrome\userChrome.css.

Further, it must be in the correct user profile folder, the one which you actually use, which is loaded by default when Firefox starts.

Typing about:profiles in the address bar and Enter will show which is currently the default profile in use.

The <profile> indeed refers to an actual profile folder inside \Profiles with a name like xxxxxxxx.default-release Your mentioning C:\Users\Mal\AppData\Roaming\Mozilla\Firefox\Profiles\chrome suggests \chrome is in the wrong directory. So, C:\Users\<user>\AppData\Roaming\Mozilla\Firefox\Profiles\xxxxxxxx.default-release\chrome\userChrome.css. Further, it must be in the ''correct'' user profile folder, the one which you actually use, which is loaded by default when Firefox starts. Typing '''about:profiles''' in the address bar and Enter will show which is currently the default profile in use.
這篇文章有幫助嗎? 1
引用
malaus1 1 個解決方法 33 個答案

That worked. You're legends Corel & cranky goat. Many thanks. Now all that needs gto be done is to pressure Mozilla to develop a simple fix for the next update ballsup.

That worked. You're legends Corel & cranky goat. Many thanks. Now all that needs gto be done is to pressure Mozilla to develop a simple fix for the next update ballsup.
這篇文章有幫助嗎? 0
引用
crankygoat
  • Top 25 Contributor
40 個解決方法 471 個答案

Fantastic!

Just be aware that FF 73 is out soon, and that the chrome code does frequently change while Firefox is yet going through a fairly major changes.

Fantastic! Just be aware that FF 73 is out soon, and that the chrome code does frequently change while Firefox is yet going through a fairly major changes.
這篇文章有幫助嗎?
引用
cor-el
  • Top 10 Contributor
  • Moderator
17768 個解決方法 160708 個答案

有幫助的回覆

The code I posted above still works for me in 73 (beta RC; about to be released) and 74 (Nightly build) with and without @namespace line.

The code I posted above still works for me in 73 (beta RC; about to be released) and 74 (Nightly build) with and without @namespace line.

由 cor-el 於 修改

這篇文章有幫助嗎? 1
引用
crankygoat
  • Top 25 Contributor
40 個解決方法 471 個答案

Good to know in advance. Thanks, cor-el.

Good to know in advance. Thanks, cor-el.
這篇文章有幫助嗎? 1
引用
malaus1 1 個解決方法 33 個答案

Probably won't update for a long while. Not until Mozilla provides a fix. Have to spend too much time restoring my preferences.

Probably won't update for a long while. Not until Mozilla provides a fix. Have to spend too much time restoring my preferences.
這篇文章有幫助嗎?
引用
問個問題

如果您還沒有帳號,您必須先 登入您的帳號 來回覆文章。請 開始一個新問題