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

Lolu chungechunge lwavalwa lwabekwa kunqolobane. Uyacelwa ubuze umbuzo omusha uma udinga usizo.

tabs not on bottom

  • 33 uphendule
  • 14 zinale nkinga
  • 55 views
  • Igcine ukuphendulwa ngu the-edmeister

more options

I just updated to Firefox 65 and suddenly my tabs are once again up in the gods. How do I get them down below the bookmarks toolbar and address bar? I've tried Userchrome and followed the 2017 video (which was very lcear by the way) that was recommended in Firefox support but it didn't work and I'm at my wits end. I hate this tabs on top thing and just want to put it back where it belongs. Please help?

I just updated to Firefox 65 and suddenly my tabs are once again up in the gods. How do I get them down below the bookmarks toolbar and address bar? I've tried Userchrome and followed the 2017 video (which was very lcear by the way) that was recommended in Firefox support but it didn't work and I'm at my wits end. I hate this tabs on top thing and just want to put it back where it belongs. Please help?

Isisombululo esikhethiwe

Yep, that's what I had in my userChrome.css originally as well.

What I did was:

1) delete the previous code in your userChrome.css (note: if you have other tweaks, make sure to only delete the code relating to tabs-on-bottom. If not it's probably safe to remove it all, but it's worth backing up your previous file just in case). 2) go to my combined CSS code here and click 'Raw' to get the raw code 3) copy that and paste it into your userChrome.css 4) save and relaunch and you should have tabs on bottom again.

You'll see instantly that the new CSS code is much more complex and does much more stuff - note that I have only glanced through it so I'm not sure what other changes are made, so you may see other effects. Use with caution :)

Edit #2: I recommend the CSS in this solution as it is less code & thus simpler! I adjusted the `min-height` fields to 32px.

(edited first point to clarify as it doesn't appear in context now that it's marked a solution)

Funda le mpendulo ngokuhambisana nalesi sihloko 👍 5

All Replies (13)

more options

This use to be a feature. But what is worse I hear the Apple users still get it.

more options

Well the solution above worked for me, and it was fairly easy to do, but I would still like to know who to complain to. It's ridiculous that programmers - out of the goodness of their hearts - have to spend time writing this code and troubleshooting it, and then sharing it on this forum, instead of just having it be an option in the customize section.

more options

Anaya said

This is neither a solution nor a comment, because I am going to have to try these various suggestions later. I just want to say, after all these years, and the countless number of complaints they have received on this ONE topic, when the hell is "tabs on bottom" simply going to be part of the Customize menu for the toolbars? It is ridiculous that all of us non-programmers have to go through this process of finding hidden files and copying and pasting code - that we don't understand and can't adjust if it doesn't work - every single time FF updates. I don't want to switch browsers. I'm in my 60's and don't want to learn to use a different one. But this is SO ANNOYING and really makes me think FF programmers are paying no attention to us users.

I have to agree. Even before having to go into the config file was a pain but at least it was simpler then this CSS coding route we now have to take. A simple tabs on bottom tick box is all they have to do. Their the programmers and I for one would feel much better with them doing the coding so we know the coding is safe (No offense to those who have helped with coding but none of us know each other so!!!)I refuse to use Chrome and hate Explorer so FF is my only real option and it's a shame the devs can not get one request added that is probably one of the most sought after feature requests as we all have to go through all this with every major update like 65 was where the whole head of the browser seemed to change!

Maybe we should allo just constantly offer them feedback even though who want tabs on top like they were can't hurt for you folks to also offer feedback to allow a setting option to have tabs on top or tabs on bottom.

Goto the Help Tab and then select submit feedback perhaps if they get enough of it on a constant basis this feature will be brought back!

I for one hate tabs on the and the last few days have bee a nightmare of wrong clicks being I kept thinking my bookmark bar was my tabs bar!!

more options

Anaya said

Well the solution above worked for me, and it was fairly easy to do, but I would still like to know who to complain to. It's ridiculous that programmers - out of the goodness of their hearts - have to spend time writing this code and troubleshooting it, and then sharing it on this forum, instead of just having it be an option in the customize section.

Goto HELP and then select SUBMIT FEEDBACK perhaps if enough of us keep sending feedback often enough it will be readded back to the browser!

more options

Somebody mentioned something called Waterfox the down side being that not all apps work under it. Also I have been getting freeze ups lately and even under 65 though I have disabled hardware acceleration and selected the maximum amount of processes possible.

more options

Using this code, how do I remove the 1-2px (1 seems to be shadow/shading) white line between the bottom of my tabs and the webpage im looking at?

more options

I don't know I am not a coder

more options

Okay, so I've got my Tabs back in their rightful place, and I've removed the blue stripe on the active tab. My question is how do I permanently show the 'new Tab' icon/button? Currently it only highlights on 'mouse-over'. This will also go for the 'move Tabs left / move Tabs right' icons/buttons when too many Tabs are open and the 'down arrow' opening all tabs in a popup. I also found commenting out the last line;

/#toolbar-menubar[autohide="true"] ~ #TabsToolbar {padding-right: 100px !important;}

helped give me more room for my Tabs.

more options

Anaya said

This is neither a solution nor a comment, because I am going to have to try these various suggestions later. I just want to say, after all these years, and the countless number of complaints they have received on this ONE topic, when the hell is "tabs on bottom" simply going to be part of the Customize menu for the toolbars? It is ridiculous that all of us non-programmers have to go through this process of finding hidden files and copying and pasting code - that we don't understand and can't adjust if it doesn't work - every single time FF updates. I don't want to switch browsers. I'm in my 60's and don't want to learn to use a different one. But this is SO ANNOYING and really makes me think FF programmers are paying no attention to us users.

I 100 % agree, why isn't this a Built IN option. Mozilla keeps saying they are "Trying to Improve Firefox" and every time there is a update I lose add-ons and usability. Add-ons Developers give up on because they are forces to re-write their Add-on from the bottom up. So users are left for hours searching and trying to find a similar working add on if any. Tabs are your Work Area, no one I know puts their tool boxes ,so to say, in front their Work Area.

more options

trog said

Yep, that's what I had in my userChrome.css originally as well. What I did was: 1) delete the previous code in your userChrome.css (note: if you have other tweaks, make sure to only delete the code relating to tabs-on-bottom. If not it's probably safe to remove it all, but it's worth backing up your previous file just in case). 2) go to my combined CSS code here and click 'Raw' to get the raw code 3) copy that and paste it into your userChrome.css 4) save and relaunch and you should have tabs on bottom again. You'll see instantly that the new CSS code is much more complex and does much more stuff - note that I have only glanced through it so I'm not sure what other changes are made, so you may see other effects. Use with caution :) Edit #2: I recommend the CSS in this solution as it is less code & thus simpler! I adjusted the `min-height` fields to 32px. (edited first point to clarify as it doesn't appear in context now that it's marked a solution)

this worked, the only problem now is that my multirow bookmarks is not working... is there anyway I can edit the code to fix this please? I have many bookmarks xD I tried on my own but couldnt figure it out

more options

I'm posting this in all the threads I can find since all the solutions are leaving out important information, like where to find userChrome.css.

  • Click 'Help' from the menu at the top of Firefox.
  • Click 'Troubleshooting Information'.
  • Look for an option that says 'Open Folder' next to 'Profile Folder'. This will open a new explorer window.
  • There should be a folder there called 'Chrome'.
  • In this folder, you might find userChrome.css. If not, hold down the shift key, right click in the empty space, and select 'Open command window here'. You will get a black window with white text. Type the following command and hit enter:
type nul > userChrome.css
  • Now open the userChrome.css file, paste the following code over anything in there already and save the file:
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

/* 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;
}

#tabbrowser-tabs {
  width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}

/* TABS: height */
:root {
 --tab-toolbar-navbar-overlap: 0px !important;
 --tab-min-height: 33px !important; /* adjust to suit your needs */
}
: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;
}

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

Just put this code in the userChrome.css file. I tested it using Firefox 59 and 65 under Windows 10. The first ":root" block is not really necessary, but it improves the shadowing of the font.

:root, .tabbrowser-tab { 

text-shadow: none !important;

}

:root[uidensity=compact] { 
--tab-min-height_tnot: 28px;

}

#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox { 

padding-bottom: calc(1px + var(--tab-min-height_tnot)) !important;

}

#TabsToolbar { 

position: absolute !important; bottom: 0 !important; width: 100vw !important;

}

Okulungisiwe ngu Demetrius

more options

Asked and answered to the satisfaction of the OP.


locking this thread due to it deteriorating into a complaints thread.

  1. 1
  2. 2