Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Tabs on bottom only partially solved for FF 72.01

  • 14 replies
  • 1 has this problem
  • 6 views
  • Paskiausią atsakymą parašė SasoDuck

more options

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?

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

Skaityti atsakymą kartu su kontekstu 👍 0

All Replies (14)

more options

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).

more options

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 by Firefox Account

more options

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:

  1. 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.
  2. Rename userChrome.css to userChrome.css.bak.
  3. Restart Firefox in order to verify that the tabs are on top and work as expected in normal and Private Browsing modes.
  4. Create userChrome.css with only the "Tabs on Bottom" code in it.
  5. Restart Firefox in order to verify that the tabs are on the bottom and work as expected in normal and Private Browsing modes.
  6. 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!

more options

Maybe add this code to the file:

.private-browsing-indicator {display: none !important;}
.accessibility-indicator    {display: none !important;}
more options

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.

more options

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.

more options

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 by Firefox Account

more options

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.

more options

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;}
more options

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 by Firefox Account

more options

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.

more options

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.

more options

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?

more options

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 :)