X
Tap here to go to the mobile version of the site.

ஆதரவு மன்றம்

Tabs on bottom--still no solution

  • 16 replies
  • 2 இந்த பிரச்னைகள் உள்ளது
  • Last reply by malaus1
பதிவிடப்பட்டது

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.
Attached screenshots

rosawood மூலமாக திருத்தப்பட்டது

மேற்கோள்

Additional System Details

பயன்பாடு

  • 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
17759 தீர்வுகள் 160605 பதில்கள்
பதிவிடப்பட்டது

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
17759 தீர்வுகள் 160605 பதில்கள்
பதிவிடப்பட்டது

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
17759 தீர்வுகள் 160605 பதில்கள்
பதிவிடப்பட்டது

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
17759 தீர்வுகள் 160605 பதில்கள்
பதிவிடப்பட்டது

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
17759 தீர்வுகள் 160605 பதில்கள்
பதிவிடப்பட்டது

உதவிகரமான பதில்

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.
இது உங்களுக்கு பயனுள்ளதாக இருந்ததா?
மேற்கோள்
கேள்வி எழுப்பு

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.