Yonke imikhiqizo Isithangami Sokwesekwa

HERE IS THE ANSWER Here is the answer to get TABS BELOW with Firefox V90 . . copy all of this code below the broken line into your - userChrome.css - file and save it. You can modify the 45px in this line if you wish to get an appropriate height . . just experiment with different numbers till you get it right --menubar-height: 45px; /*30px|41px=11px; caption buttons on menubar*/

Also to make the tabs wider or narrower, modify the line which is coded width: 50vw !important;

Finally you must enable - css - in Firefox, by typing about:config into your address bar, and search for toolkit. When all the toolkit options appear change the one which says toolkit.legacyUserProfileCustomizations.stylesheets to TRUE by click the icon in the right hand column. Than close Firefox and reopen, and check how it looks This will enable your - css - file to be read, and interpreted and accepted by the Firefox browser.

-------------------------------------------------------------------

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* TABS: bottom - Firefox 65 and later - updated for 89+ */
/* https://searchfox.org/mozilla-release/source/browser/themes/shared/tabs.inc.css */
/* https://raw.githubusercontent.com/Aris-t2/CustomCSSforFx/master/classic/css/tabs/tabs_below_navigation_toolbar_fx89.css */
/* https://developer.mozilla.org/en-US/docs/Tools/Browser_Toolbox */

/* ROOT - VARS */
/* you can adjust the CSS variables until it looks correct */
/* you can use the Browser Toolbox to get the toolbar heights */

*|*:root {
  --tab-toolbar-navbar-overlap: 0px !important;

  --tab-min-height: 40px !important;
  --tab-min-width:  60px !important;

  --tab-adjust:  0px; /* adjust tab bar - only for 68-73 */
  --tab-caption: 5px; /* caption buttons on tab bar */
}

/* TAB BAR - below nav-bar */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10 !important;}
#TabsToolbar {-moz-box-ordinal-group:1000 !important;}

#TabsToolbar {
  display: block !important;
  position: absolute !important;
  bottom: 0 !important;
  width: 50vw !important;
}

#tabbrowser-tabs {
  width: 100vw !important;
}

/* navigator-toolbox - PADDING */
*|*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {
  position: relative !important; /*89+*/
  padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*ADJUST*/
  background-color: var(--toolbar-bgcolor) !important;
}

/* TabsToolbar with menubar and titlebar hidden - rules for Firefox 65-73 */
*|*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"]) #toolbar-menubar[autohide="true"] ~
 #TabsToolbar{
  bottom: var(--tab-adjust); /*ADJUST*/
}

/* TABS: height */
#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;
}

#TabsToolbar {
  height: var(--tab-min-height) !important;
  margin-bottom: 1px !important;
  box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /*OPTIONAL*/
  background-color: var(--toolbar-bgcolor) !important;
  color:            var(--toolbar-color) !important;
/*  z-index: 1 !important; */
}

/* indicators *//*
*|*:root[privatebrowsingmode=temporary] .private-browsing-indicator {
  position: absolute !important;
  display: block !important;
  right: 0px !important;
  bottom: 0px !important;
  width: 14px !important;
  pointer-events: none !important;
}
*/
.private-browsing-indicator {display: none !important;}
.accessibility-indicator    {display: none !important;}

/* Indicators - HIDE *//*
*|*:root:not([accessibilitymode])             .accessibility-indicator    {display: none !important}
*|*:root:not([privatebrowsingmode=temporary]) .private-browsing-indicator {display: none !important}
*/

/* Drag Space */
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
  width: 20px !important;
}

/* 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 window-controls and caption buttons on Tab Bar */
#TabsToolbar #window-controls {display: none !important;}
#TabsToolbar .titlebar-buttonbox-container {display: none !important;}

Hi

Running Firefox 71.0 (64 bit)

Well seems Firefox has been messing this up again.

Anyone have the new work around solution to get my tabs back on the bottom again. They were fine this morning then shut down and went out to lunch and when I came back they were back on the top again after months of being where I wanted them below my bookmark bar.

Thoughts on this?

Thanks Dave

Today I updated my Firefox Developer Edition to version 89.0b2 and now I just can not look at this browser anymore, "Inspired new tab design" is taking too much space and now became largest and at the same time least information-dense panel in my entire desktop! I searched around the web for a bit in hopes that I will find a theme or an add-on that will revert this particular change but no luck. I really want to revert to old UI look (at least tabs bar), there should be default theme or option to get back to old style. After some investigation I found userChrome.css but don't really want to install it (maybe this is actually the way of doing this kind of styling). Please help me revert UI design to old one.

Last time Firefox updated, I managed to find information online about moving the website tabs so they were below the bookmarks instead of at the top of the screen. It was a huge pain-in-the-butt to do.

After a recent re-install, the tabs have moved themselves back to the top of the screen and nothing I do seems to be able to move them back below the bookmarks.

Is there a way I can move the tabs that doesn't involve spending hours hunting through posts on the web, changing hidden Firefox settings, and recoding .css files?

If not, why do you not give the option to move the tabs wherever the user wants? Especially when it makes far more sense to have the website tabs directly above the website being viewed, at least in my opinion?

I'm currently using Firefox 85.0.2 (64-bit).

Hi

to ALL Firefox admins and programmers.....

I think Im speaking for most people when I say this......

PUT THE DAMN TABS !!!!!BELOW!!!! the address bar already!!

People have been begging you to do this for ******* years!!!

Stop being such a**holes and make it like this BY DEFAULT FOREVER! And add a simple option in the setting that always allows the user to put the tabs above or below....but I know most people want this always BELOW!!!

Fix this issue PLEASE it pisses soooo many people off having the tabs above the address bar. ...Also when I double click on the empty space beside the tabs it just shrink the open window.....change this so double clicking on the empty area OPENS A NEW TAB...

Signed a VERY pissed off user!

I would like to set the tabs to display below the address bar in Firefox 89 64bit. I believe the setting is in about:config but I can't find it. Firefox does this every so often and I wish they would just have a button to say tabs on top, or tabs below address bar.

Sorry to rub salt into old wounds but this quote from a 2014 support post expresses my feelings exactly:

"What's the point of a 'tab' if there's no tab? Text floating around at the top of the page is not a tab."

With the latest update, my tabs are now a complete blank space with tiny little words. How can I get something back, like a border, to define them again? Thanks for your help.

Hello, it is enough to search "version 89 visuals" in the help forum to find dozens of topic complaining how awful it looks, and the reduced functionality, content on screen and efficiency.

Luckily in one of the threads I found solution, and links to articles to fix most of the biggest issues:

As a temporary tactic to buy time, you can use a preference to revert the tab bar to its older appearance. This is just for Firefox 89, so you have a month to keep an eye out for the next workaround. To set that up: (1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button accepting the risk. (2) In the search box in the page, type or paste proton (or full browser.proton.enabled) (3) Double-click the preference to switch between true (new Proton style) and false (old Photon style) Since this was kept in just for testing, there might be some occasional glitches.

Here the options I changed - set false to all.

   browser.proton.contextmenus.enabled
   browser.proton.doorhangers.enabled
   browser.proton.enabled
   browser.proton.modals.enabled
   browser.proton.places-tooltip.enabled

+ even further reduction of the spaces -> browser.uidensity -> 1

I expect the new Proton view is inspired by touch screens - and is more optimized for tablets, giving more space around individual options, with extra space around them - to make sure you hit the right option with your finger. The downside is we get less visible options on the screen, as now each option takes more space - and it is absolutely awful and less visible for people using desktop mode, and using the more precise mouse and/or keyboard.

And here a list of the problems and annoyances in V89, and why they are a problem (and these are only the ones I noticed so far - attached is a screenshot collage of the issues.

1. Tabs which play audio no longer show that they play audio, unless I hover on top of them - which is a big problem if you have 20 tabs, and are searching which one auto-played some audio. In the previous version each tab playing audio had the audio icon on top of it. 2. My bookmarks take much more space on my screen, and while previously I organized them to fit perfectly to it, now are going outside of it, and I have to (unnecessarily) scroll to find more. 3. On YouTube There was a "delete video" button next to each video in my "watch later" list, and I was able to quickly delete the watched ones. Now I have to click on the 3 dots, and then on the trash bin button to delete. Much slower an annoying. Return to the old vision (sadly I cannot find a way to fix this yet)

This totally failed visualization must IMMEDIATELY be reversed, and you must add option in the VIEW menu - which switches between the old DESKTOP view (version 88 style), and new TABLET view (V89 style).

And it must not be allowed that you disable the browser.proton.enabled option in the next update, as this will force us to use only the new awful view, and give us 3 options:

1. Revert to 88. I have already backed up my profile, and downloaded it, in case V90 ruins the view permanently. This also opens us to security risks - so I can allow this for no more than 2-3 months, in hope you fix this fail. 2. Switch browser. Move to Vivaldi (which I use at work) or Brave, if you refuse to fix the fail. 3. Accept the awful view - not going to happen to me. I am using Mozilla since Netscape, but this fail is infuriating enough to make me switch if made permanent / even worse.

6/7/21 Firefox just did an update on my computer. Before, the tool bar at the top was dark gray and the tabs were easily distinguishable. Now the entire area above the URL is light gray. I would prefer more contrast between the tool bar and the tabs. What happened? Thank you.

Please, PLEASE put back the space between the tabs in the Proton version of Firefox. As a web designer, I don't understand how any designer on your staff or any supervisor would okay what looks like a seamless tab bar. The UX is horrible.

I've temporarily changed the about:config to mimic Photon. But I understand you are going to get rid of that ability in the about:config file.

Why do you tweak a decent UI into an unusable one? This is becoming an epidemic. Similar things happen on Facebook and with Photoshop (where "upgrades" make parts of the application unusable—that is, they no longer work).

One of the latest FF updates broke my workflow. (https://xkcd.com/1172/) I'm using the browser in full-screen mode all the time (13" doesn't provide that much of vertical space), and now it shots down every time I tap ESC — which, as you may imagine, I do a lot. Don't like being that guy, but this _really_ breaks the flow. Could you tell, is it 1) intentional change; 2) and configurable behavior. What can I do to revert this particular thing?

why speed dail fvd addon was disabled ?? I lost all pages saved, there was no readable message with you turning off the addon. it works fine on chrome, now I have to add the support file all over again, it also does not work. I use firefox from the very beginning but after such action, sorry but I will change the browser or you will help

.tabbrowser-tab:hover

with what can i replace "hover", if i want to do the command be active not only when hover over mouse but always?

duplicate. /questions/1368296 userChrome.css code /questions/1368519 userChrome.css code hide scroll bar

1) Why in Firefox when a video is played in full screen the tab is moved to the right where sign + new tab, If there's many tabs in the left side 2) After updating to a new version, the speaker icon disappears on the tabs in which the audio or video was playing, it becomes visible only when you hover over it with the mouse pointer. this is very annoying

In settings, Start-up, I have the box checked for: "open previous windows and tabs" but it doesn't work. In order to do my work I need the 23 tabs I currently have open to show up again after a reboot of the browser or computer. What gives? How long will it take to get this corrected? Please give me help. Thanks, Mark

I've tried everything and read all the instructions but none work.

Locking this thread.
Please continue here: [/questions/1409196]
Hi, I disabled several options in About:Config, and a feature previously disappeared. When I pressed the scroll button in the diamond, it opened a tag and moved to it automatically. Whatever you do with the current tag, I want it. Please help me.