Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

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

Tab bar does not appear during fullscreen mode (when it is located under nav-bar)

  • 5 majibu
  • 1 ana tatizo hili
  • 1 view
  • Last reply by cor-el

more options

Hello,

after update to FF57, I puted my tab-bar back bellow navigation bar (where it should be :) ) according to a vast solution dealing with userChrome.css modification.

However, it leads to weird behaviour of tab-bar (and nav-bar, tool-bar, etc.) during fullscreen mode (F11). When I launch FF, first time (going into FS mode) those bars will no hide automatically. After a few times and tab switching, they hide (as they should) but then they do not show up again (when hover over by mouse). However, it is still possible to open them by right-click (it is still possible to seeup there like a pixel narrow bar of those tabs).

This does not occure when I run FF without userChrome.css file (modified for tab below nav-bar). I think it might be something wrong in that file, cos when I remove "-border-top-width: 0 !important;" part it dissapear at first time (without appearing again).

Please help me find solution for this.

userChrome.css: /* Tab bar below Navigation & Bookmarks Toolbars */

  1. nav-bar { /* main toolbar */
   -moz-box-ordinal-group: 1 !important;

-border-top-width: 0 !important; }

  1. PersonalToolbar { /* bookmarks toolbar */
 -moz-box-ordinal-group: 2 !important;

}

  1. TabsToolbar { /* tab bar */
 -moz-box-ordinal-group: 3 !important;

}

/* To create space for the standard window buttons, either

  (1) Show the title bar
  (2) On Windows, show the menu bar
  (3) Enable the following rule by removing the comment tags */

/*

  1. navigator-toolbox {
 padding-top: 20px !important;

}

  • /

/* If there is an undesirable color behind the tab bar, either

  (1) Install a theme to fill in the background from
      https://addons.mozilla.org/firefox/themes/
  (2) Enable the following rule by removing the comment tags,
      then edit to the desired color */

/*

  1. TabsToolbar {
 background-color: #f8f8f8 !important;

}

  • /
Hello, after update to FF57, I puted my tab-bar back bellow navigation bar (where it should be :) ) according to a vast solution dealing with userChrome.css modification. However, it leads to weird behaviour of tab-bar (and nav-bar, tool-bar, etc.) during fullscreen mode (F11). When I launch FF, first time (going into FS mode) those bars will no hide automatically. After a few times and tab switching, they hide (as they should) but then they do not show up again (when hover over by mouse). However, it is still possible to open them by right-click (it is still possible to seeup there like a pixel narrow bar of those tabs). This does not occure when I run FF without userChrome.css file (modified for tab below nav-bar). I think it might be something wrong in that file, cos when I remove "-border-top-width: 0 !important;" part it dissapear at first time (without appearing again). Please help me find solution for this. userChrome.css: /* Tab bar below Navigation & Bookmarks Toolbars */ #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; -border-top-width: 0 !important; } #PersonalToolbar { /* bookmarks toolbar */ -moz-box-ordinal-group: 2 !important; } #TabsToolbar { /* tab bar */ -moz-box-ordinal-group: 3 !important; } /* To create space for the standard window buttons, either (1) Show the title bar (2) On Windows, show the menu bar (3) Enable the following rule by removing the comment tags */ /* #navigator-toolbox { padding-top: 20px !important; } */ /* If there is an undesirable color behind the tab bar, either (1) Install a theme to fill in the background from https://addons.mozilla.org/firefox/themes/ (2) Enable the following rule by removing the comment tags, then edit to the desired color */ /* #TabsToolbar { background-color: #f8f8f8 !important; } */

Chosen solution

cor-el said

Did somemore testing and this code works for me with setting --tab-toolbar-navbar-overlap to 0px.
:root {
  --tab-toolbar-navbar-overlap: 0px !important;
  --tab-min-height: 25px !important;
}
#TabsToolbar {height:var(--tab-min-height)!important;

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#TabsToolbar {-moz-box-ordinal-group:1000!important}

Yes, this works also in my case. Thank you very much for your time and effort.

Read this answer in context 👍 1

All Replies (5)

more options

I can confirm this on Linux with the tabs on bottom.

What works for me is to move the mouse pointer either to the top left or top right corner of the screen to trigger the full screen toggler. I don't know if this works on Windows as well.

more options

cor-el said

I can confirm this on Linux with the tabs on bottom. What works for me is to move the mouse pointer either to the top left or top right corner of the screen to trigger the full screen toggler. I don't know if this works on Windows as well.

No, unfortunatelly not. On top of the screen I can see only that 1pix high remnant of tabs-bar or panel bar (shown in screenshot, when cursor is in right up corner - close button).

more options

Did somemore testing and this code works for me with setting --tab-toolbar-navbar-overlap to 0px.


:root {
  --tab-toolbar-navbar-overlap: 0px !important;
  --tab-min-height: 25px !important;
}
#TabsToolbar {height:var(--tab-min-height)!important;

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#TabsToolbar {-moz-box-ordinal-group:1000!important}
more options

Suluhisho teule

cor-el said

Did somemore testing and this code works for me with setting --tab-toolbar-navbar-overlap to 0px.
:root {
  --tab-toolbar-navbar-overlap: 0px !important;
  --tab-min-height: 25px !important;
}
#TabsToolbar {height:var(--tab-min-height)!important;

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#TabsToolbar {-moz-box-ordinal-group:1000!important}

Yes, this works also in my case. Thank you very much for your time and effort.

more options

You're welcome and thanks for confirming that it works on Windows as well.

Actually this helped me fix the Tab bar height as well that previously didn't work very well, so I added that as a bonus.