Tabs on bottom only partially solved for FF 72.01
I had previously posted the "Why doesn't Firefox provide the option of tabs below menu bar?" at: https://support.mozilla.org/en-US/questions/1276795
I believed that the issue was solved by cor-el at https://support.mozilla.org/en-US/questions/1274416#answer-1279083
However, I have since discovered that this fix does not work in Private Browsing mode. Tabs still overlap the bookmark toolbar as they did with regular browsing before applying the aforementioned fix.
Does anyone have a modification to the userChrome.css file or tabs-on-bottom.css file referred to earlier which will place tabs below the menu/bookmark toolbar when using Private Browsing as well?
Chosen solution
Peter and cor-el:
Success!
Thank you both very much for your assistance and, especially, your patience. The solution turned out to be a userChrome.css file with nothing but the tabs-on-bottom code and the two lines added suggested by cor-el.
Thanks again, Allan
Read this answer in context 👍 0All Replies (14)
Try removing the XUL namespace statement from userChrome.css instead of just having it appear after the "Tabs on Bottom" code or import statement.
With the "Tabs on Bottom" code in userChrome.css, directly, without the XUL namespace, on Windows 10 Pro 64-bit and Linux (Kubuntu 18.04, kernel 4.15, 64-bit), both running Firefox 72.0.1 (64-bit), the tabs work properly in Private Browsing as well as in "normal" browsing (for me, at least).
Peter Humphries said
Try removing the XUL namespace statement from userChrome.css instead of just having it appear after the "Tabs on Bottom" code or import statement. With the "Tabs on Bottom" code in userChrome.css, directly, without the XUL namespace, on Windows 10 Pro 64-bit and Linux (Kubuntu 18.04, kernel 4.15, 64-bit), both running Firefox 72.0.1 (64-bit), the tabs work properly in Private Browsing as well as in "normal" browsing (for me, at least).
Thanks for the reply, but I think that you lost me. Are you saying: 1. Leave the import url statement but delete the @namespace url statement from userChrome.css. 2. Copy the code from the tabs-on-bottom.css file and paste it below the import url statement in userChrome.css. 3. Leave the tabs-on-bottom.css file as it is.
That results in a userChrome.css file without an @namespace url statement and apparent duplication of the tabs-on-bottom code. If that's what you mean, it doesn't work for me in Windows 8.1 Pro. OTOH, if I've got it wrong, I would appreciate it if you would explain in detail where I have gone astray.
Modified
I apologise for sowing confusion!
Although it does not appear to make a difference on the Windows 10 machine on which I am testing it, I thought that "Private Browsing" might be applying the XUL namespace to your "Tabs on Bottom" code regardless of where you put it.
If "Tabs on Bottom" is the only thing in your userChrome.css file, I suggest that you put the code directly in userChrome.css (without the XUL namespace statement) and see if that fixes your "Private Browsing" issue.
Other possibilities include:
- You have an Add On interfering with "Tabs on Bottom" in Private Browsing mode. Try starting Firefox with Add Ons Disabled (from your Help menu).
- You have some other code in userChrome.css that interferes with the "Tabs on Bottom" code in Private Browsing mode. Try starting with only "Tabs on Bottom" code in userChrome.css and add back other code until it breaks, again.
- You are starting a different profile for Private Browsing. If you have somehow rigged this up, you just need to find its userChrome.css file. It is highly unlikely that you are doing this without realising it, though.
Overall, here is how I would troubleshoot your installation:
- Ensure that you are working on the correct userChrome.css file by checking your active profile at "about:profiles" -- on Windows, it is the profile in the "Roaming" directory that you need to change, if there is a "Root" (the "Roaming" directory) and a "Local" (the "Local" directory) listed.
- Rename userChrome.css to userChrome.css.bak.
- Restart Firefox in order to verify that the tabs are on top and work as expected in normal and Private Browsing modes.
- Create userChrome.css with only the "Tabs on Bottom" code in it.
- Restart Firefox in order to verify that the tabs are on the bottom and work as expected in normal and Private Browsing modes.
- Add back any other code that you want in your userChrome.css file and repeat from step five until you are happy with the results.
If there is any difference between the normal and Private Browsing modes in step three or in step five, restart Firefox with Add Ons disabled (from the Help menu) to see if that makes a difference.
I hope that these suggestions are helpful. Good luck!
Maybe add this code to the file:
.private-browsing-indicator {display: none !important;} .accessibility-indicator {display: none !important;}
cor-el said
Maybe add this code to the file:.private-browsing-indicator {display: none !important;} .accessibility-indicator {display: none !important;}
I do have that code on my Win10 test machine, but its absence or presence does not change the behaviour of my "Tabs on Bottom" code in "Private Browsing" mode (other than making the indicators appear or disappear).
Of course, unlike the OP, I am not able to duplicate the "works in normal mode, does not work in Private Browsing mode" problem.
Maybe the OP can post a screenshot of what it looks in private browsing mode. The indicators can cause a problem because they are positioned absolutely via a 'top' rule and cause weird effects. That is why most code for tab on bottom disable them.
Chosen Solution
Peter and cor-el:
Success!
Thank you both very much for your assistance and, especially, your patience. The solution turned out to be a userChrome.css file with nothing but the tabs-on-bottom code and the two lines added suggested by cor-el.
Thanks again, Allan
Modified
You can pin the about:privatebrowsing tab with the mask to make it only show the mask. That is probably as good as showing the indicator.
Alternatively, you can replace :root with *|*:root in the current code. That seems to be working as well with the @namespace line.
Example of code with *|*:root:
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* TABS: bottom - Firefox 65 and newer */ #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) { -moz-box-ordinal-group: 10 !important; } #TabsToolbar { -moz-box-ordinal-group: 1000 !important; display: block !important; position: absolute !important; bottom: 0 !important; width: 100vw !important; } #tabbrowser-tabs { width: 100vw !important; } *|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox { padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*adjust*/ } /* Firefox 65-73, not needed in current Nightly for me */ *|*: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) - 20px) !important; /*adjust*/ } /* TABS: height */ *|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust or omit to use density*/ } *|*:root #tabbrowser-tabs { --tab-min-width: 80px !important; /*adjust or omit to use default*/ } #TabsToolbar { height: var(--tab-min-height) !important; margin-bottom: 1px !important; box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /*omit*/ background-color: var(--toolbar-bgcolor) !important; color: var(--toolbar-color) !important; } /* indicators - hide */ .private-browsing-indicator {display: none !important;} .accessibility-indicator {display: none !important;} /* window controls hide*/ #TabsToolbar #window-controls {display: none !important;} /* caption buttons - hide */ *|*:root[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {display: none !important;}
cor-el said
You can pin the about:privatebrowsing tab with the mask to make it only show the mask. That is probably as good as showing the indicator.
Thank you again for the replies.
However, I'm not that up to speed with using code and I don't understand your most recent post. As it raises too many questions, I had best leave that alone and stick with your first suggestion.
I see that right clicking the Private Browsing tab and selecting "Pin" reduces the tab to essentially a Private Browsing indicator. I can then open pages in new full size tabs. Is the result of clicking "Pin" what you refer to as "the mask"? I haven't come across that term before.
Modified
With mask I refer to the purple mask favicon you see on the tab if you open the about:privatebrowsing page. You only get the purple mask in a Private Browsing mode window.
cor-el said
With mask I refer to the purple mask favicon you see on the tab if you open the about:privatebrowsing page. You only get the purple mask in a Private Browsing mode window.
Got it. Thanks again.
cor-el said
Alternatively, you can replace :root with *|*:root in the current code. That seems to be working as well with the @namespace line.
That is interesting. Do you think that it is wise to keep the XUL namespace, if it is not needed, since it is being eliminated?
cor-el said
Maybe add this code to the file:.private-browsing-indicator {display: none !important;} .accessibility-indicator {display: none !important;}
Thanks Cor! This has been driving me nuts for... many MANY months now and finally got around to googling it. Turns out your solution worked! Much appreciated :)