Tabs below address bar Firefox 89.0

User Help for Mozilla Firefox
Post Reply
Acedonno
Posts: 17
Joined: June 15th, 2013, 2:41 pm

Tabs below address bar Firefox 89.0

Post by Acedonno »

I have firefox 89.0 installed and as usual they moved the tabs above address bar again. I found this code online and I copied the code put it in a file called 'chrome.css' and put it in firefox profile folder and still the tabs are on top of address bar. Is this right or am I doing it wrong?

Here is the code and I got it from https://www.reddit.com/r/FirefoxCSS/com ... irefox_89/:

/* Source file https://github.com/MrOtherGuy/firefox-c ... bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/

/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/

:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }

/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }

/* Source file https://github.com/MrOtherGuy/firefox-c ... _patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */

:root{ --uc-window-control-width: 0px !important }

#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }

#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}

#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }

#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}

#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }

#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }

/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important;
--tab-min-width: 80px !important;

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

.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}

.tab-close-button {
color: red!important;
}
User avatar
Ashleyj
Posts: 218
Joined: September 9th, 2004, 12:10 pm

Re: Tabs below address bar Firefox 89.0

Post by Ashleyj »

I tried that out on a portable version of FF89 and it did not work for me - tabs were still at the top.
batman68
New Member
Posts: 1
Joined: June 21st, 2021, 12:25 pm

Re: Tabs below address bar Firefox 89.0

Post by batman68 »

Acedonno;

Please try the following as it is working for me.

1) There needs to be a folder called chrome in the main logged in profile folder.

2) Then copy and paste the code you listed in a file called userChrome.css (exactly as you see it) in the chrome folder from step 1

3) Restart Firefox

Viola!!

Best wishes :)
User avatar
CaJazzman
Posts: 370
Joined: March 5th, 2009, 2:21 pm
Location: Vacaville,California

Re: Tabs below address bar Firefox 89.0

Post by CaJazzman »

batman68 wrote:Acedonno;

Please try the following as it is working for me.

1) There needs to be a folder called chrome in the main logged in profile folder.

2) Then copy and paste the code you listed in a file called userChrome.css (exactly as you see it) in the chrome folder from step 1

3) Restart Firefox

Viola!!

Best wishes :)
Yes this code works for moving the tabs back up. I tried and it works. I copy and pasted the complete code from before and saved it, then copy and pasted the newer code, and Fire Fox is back to what it was before version 89. 8-)
User avatar
CaJazzman
Posts: 370
Joined: March 5th, 2009, 2:21 pm
Location: Vacaville,California

Re: Tabs below address bar Firefox 89.0

Post by CaJazzman »

Acedonno wrote:I have firefox 89.0 installed and as usual they moved the tabs above address bar again. I found this code online and I copied the code put it in a file called 'chrome.css' and put it in firefox profile folder and still the tabs are on top of address bar. Is this right or am I doing it wrong?

Here is the code and I got it from https://www.reddit.com/r/FirefoxCSS/com ... irefox_89/:

/* Source file https://github.com/MrOtherGuy/firefox-c ... bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/

/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/

:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }

/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }

/* Source file https://github.com/MrOtherGuy/firefox-c ... _patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */

:root{ --uc-window-control-width: 0px !important }

#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }

#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}

#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }

#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}

#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }

#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }

/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important;
--tab-min-width: 80px !important;

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

.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}

.tab-close-button {
color: red!important;
}
Is there anyway to ask whomever did the coding, and see if the names of the icons can be added to the menu bar, even though you can hover over them and know what their names are. Thanks In Advance! :D
alshu
Posts: 4
Joined: July 1st, 2021, 6:51 am

Re: Tabs below address bar Firefox 89.0

Post by alshu »

Didn't work for me.
User avatar
dickvl
Posts: 54145
Joined: July 18th, 2005, 3:25 am

Re: Tabs below address bar Firefox 89.0

Post by dickvl »

Try the code in my reply on page one of this thread.
http://forums.mozillazine.org/viewtopic ... #p14894226
alshu
Posts: 4
Joined: July 1st, 2021, 6:51 am

Re: Tabs below address bar Firefox 89.0

Post by alshu »

It works. Thank you!
alshu
Posts: 4
Joined: July 1st, 2021, 6:51 am

Re: Tabs below address bar Firefox 89.0

Post by alshu »

del
SouzaRM
Posts: 3
Joined: December 11th, 2011, 2:34 pm

Re: Tabs below address bar Firefox 89.0

Post by SouzaRM »

Working fine for me!
MFF NighTly 92.0a1 x64 [Release; 2021-08-01].

Thanks @AceDonno
User avatar
Lunar
Posts: 492
Joined: July 6th, 2004, 5:08 am
Location: Texas, США
Contact:

Re: Tabs below address bar Firefox 89.0

Post by Lunar »

dickvl wrote:Try the code in my reply on page one of this thread.
http://forums.mozillazine.org/viewtopic ... #p14894226
FYI:
404 - 'file not found' on your ghub...
'Microsucks' made me nuts, Linux is making me crazy...
...at least with Linux, I can afford the therapy.. : )
openSuSE | KDE | enlightenment | mozilla Aurora 55 / Nightly 106 Konqueror /Opera/ Aurora Dev Ed | Now, down to Firefox 45 52 ESR as the 'new' direction... sxxxs!
User avatar
jscher2000
Posts: 11742
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA
Contact:

Re: Tabs below address bar Firefox 89.0

Post by jscher2000 »

Why Firefox 89?
Post Reply