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

This thread was closed and archived. Please ask a new question if you need help.

Tabs bottom not working since FF57

more options

Hello, since FF57 I am not able to get my tabs to the "bottom"/under the shortcuts in a proper way. There are several solutions available.

I tried

/* +++++++++++++++ Tabs unten in Firefox 57+ (Quantum) - V 1.0 ++++++++++++++++ */
#nav-bar{ -moz-box-ordinal-group: 1 !important; border-top-width: 0px !important; padding-top: 10px !important;} /* Haupt-Leiste mit Adresse, Suchfeld, Icons */
#PersonalToolbar { -moz-box-ordinal-group: 2 !important;} /* Bookmarks */
#TabsToolbar { -moz-box-ordinal-group: 3 !important; } /* Tab-Leiste */
.tabbrowser-tab:not(:-moz-lwtheme) {border-top: 0px !important;}
:root {--tab-line-color: #f9f9f9 !important;} /* Farbanpassung aktiver Tab oben */
#TabsToolbar {padding-top: calc(var(--space-above-tabbar) + 0px) !important;} /* Abstand oben verringern bei Tabbar */
.titlebar-placeholder[type="pre-tabs"], 
.titlebar-placeholder[type="post-tabs"] {width: 0px !important;} /* 1. Tab unten Abstand links statt 40px */
/* Quellen: ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Tutorial/Modifying_the_Default_Skin
https://github.com/Aris-t2/CustomCSSforFx
https://www.youtube.com/watch?v=3Xo-OeVjnjs 
https://www.reddit.com/r/firefox/comments/6x2tmz/can_i_have_tabs_on_bottom_and_bookmarks_above/ 
https://support.mozilla.org/de/questions/1184317
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


in the userchrome.css, it looks almost good - but there is a problem: the whole design is "jumping" ~5 pixels up when I try to move a tab to my shortcut bar...it just looks defect!

I try to attach 2 pictures here.

How do I prevent the design from jumping upwards when moving a tab?!


Furthermore regarding themes: as visible in my pictures themes also looks crappy - the menubar is dark contrary to the bright control-bar...how do I get my menu-bar in the same grey as the controlbar?

Many thanks for help. Would be awesome if Firefox will make such necessary functionality be much easier controllable in the future...Firefox´ design is a pure horror since it changed and Classic-Theme-Restorer is not available anymore.

Hello, since FF57 I am not able to get my tabs to the "bottom"/under the shortcuts in a proper way. There are several solutions available. I tried <pre><nowiki>/* +++++++++++++++ Tabs unten in Firefox 57+ (Quantum) - V 1.0 ++++++++++++++++ */ #nav-bar{ -moz-box-ordinal-group: 1 !important; border-top-width: 0px !important; padding-top: 10px !important;} /* Haupt-Leiste mit Adresse, Suchfeld, Icons */ #PersonalToolbar { -moz-box-ordinal-group: 2 !important;} /* Bookmarks */ #TabsToolbar { -moz-box-ordinal-group: 3 !important; } /* Tab-Leiste */ .tabbrowser-tab:not(:-moz-lwtheme) {border-top: 0px !important;} :root {--tab-line-color: #f9f9f9 !important;} /* Farbanpassung aktiver Tab oben */ #TabsToolbar {padding-top: calc(var(--space-above-tabbar) + 0px) !important;} /* Abstand oben verringern bei Tabbar */ .titlebar-placeholder[type="pre-tabs"], .titlebar-placeholder[type="post-tabs"] {width: 0px !important;} /* 1. Tab unten Abstand links statt 40px */ /* Quellen: ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Tutorial/Modifying_the_Default_Skin https://github.com/Aris-t2/CustomCSSforFx https://www.youtube.com/watch?v=3Xo-OeVjnjs https://www.reddit.com/r/firefox/comments/6x2tmz/can_i_have_tabs_on_bottom_and_bookmarks_above/ https://support.mozilla.org/de/questions/1184317 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */</nowiki></pre> in the userchrome.css, it looks almost good - but there is a problem: the whole design is "jumping" ~5 pixels up when I try to move a tab to my shortcut bar...it just looks defect! I try to attach 2 pictures here. How do I prevent the design from jumping upwards when moving a tab?! Furthermore regarding themes: as visible in my pictures themes also looks crappy - the menubar is dark contrary to the bright control-bar...how do I get my menu-bar in the same grey as the controlbar? Many thanks for help. Would be awesome if Firefox will make such necessary functionality be much easier controllable in the future...Firefox´ design is a pure horror since it changed and Classic-Theme-Restorer is not available anymore.

Modified by cor-el

Chosen solution

Forgot about the movingtab shifts.

  • chrome://browser/skin/browser.css

/* TAB bar - disable movingtab shifts - chrome://browser/skin/browser.css */
#TabsToolbar[movingtab] {padding-bottom:0px!important}
#TabsToolbar[movingtab] + #nav-bar {margin-top:0px!important}
#TabsToolbar[movingtab] > #tabbrowser-tabs {padding-bottom:0px!important; margin-bottom:0px!important}
Read this answer in context 👍 1

All Replies (13)

more options

Btw, same result in different OS, tried it with Linux and Win. Here are the pictures:

more options

Does this code that I use has the same problem?

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

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

/* TABS - throbber */
.tab-throbber[busy]::before {
  background-image: url("chrome://global/skin/icons/loading.png") !important;
  animation: unset !important;
}

.tab-throbber[busy]:not([progress])::before {
  /* Grays the blue during "Connecting" state */
  filter: grayscale(100%);
}

/* TABS - faded text */
.tab-label-container[textoverflow]:not([pinned]) {
  mask-image: unset !important;
}
more options

Yes, but with your .css-file it not only jumps upwards inside the panel, with your css the whole screen jumps up.

Btw, does it work normal for you? Doesn´t it jump as on my pictures on your system?

more options

I think in general it has to do something with the menubar...but I dont know...

more options

Nobody an idea? Is it a bug? What else can I try?

more options

Chosen Solution

Forgot about the movingtab shifts.

  • chrome://browser/skin/browser.css

/* TAB bar - disable movingtab shifts - chrome://browser/skin/browser.css */
#TabsToolbar[movingtab] {padding-bottom:0px!important}
#TabsToolbar[movingtab] + #nav-bar {margin-top:0px!important}
#TabsToolbar[movingtab] > #tabbrowser-tabs {padding-bottom:0px!important; margin-bottom:0px!important}
more options

@cor-el: this fixed it, many many thanks!!

Not the topic, but does anyone also have a hint for me how to get my menubar in the same themebased color as my active tabs/nav-bar?

more options

I've read through this but not sure exactly which posts to pay attention to and which not. I have a userChrome.css file for some other tweaks, but which of the ones posted on here do I need to get my tabs on the bottom without a jumping screen? First plus movingtab shifts?

more options

Hi rosawood

If you use the code in these two replies then it should work.

Note that the need to be at the top of the file.

more options

Thanks, that worked.

more options

Installed Firefox 60 today - and found out that FF looks more and more like a piece of crap every update...what the hell are the "designers" here are doing...? I would fire them immediately if I could...

Now not only the menubar has the wrong color, now also the button to open a new tab has a wrong position (~1 pixel too high), the color above the opened tab has gone and an empty line seems to be added...as said, it looks like defect crap.

By the way here is a nice comparison between FF 52 Esr and FF 60 - maybe it helps to see whats wrong..........(or how it should be).

Also the extra-bar on the bottom (-> useful for addons for example...) is completely missing since 57...Firefox is getting more and more unpopular to me (and others, too).

more options

I finally have my FF where I want it--sort of--but have set my options not to update ever. I had previously set them to "notify me first", and got an unwanted upgrade. Grrr. I agree, the developers seems to be doing whatever they want to do, just for the sake of doing it, and instead of polling anyone beforehand, they wait to see who they ticked off. Is this really what software development has come to? I used to be a software engineer, and when we developed code, we made sure it was what the customer wanted. In this case, WE are the customer, but I don't recall ever being asked what I would like to see, and the numerous requests for returning an option for tabs on bottom have been ignored.

more options

rosawood said

I used to be a software engineer, and when we developed code, we made sure it was what the customer wanted. In this case, WE are the customer, but I don't recall ever being asked what I would like to see, and the numerous requests for returning an option for tabs on bottom have been ignored.

Firefox doesn't have "customers"; no cost involved makes you guys "users" of free, open source software which is developed under "different rules".

You don't like it, don't use it! And if you want to be heard please use the appropriate channel for your complaints by submitting feedback to Mozilla directly via the Help > Submit feedback... menu item inside each and every Firefox installation. https://qsurvey.mozilla.com/s3/FirefoxInput/


Locking this solved thread.