userChrome.css not working on newly installed FF
-
- Posts: 16
- Joined: January 29th, 2019, 1:55 pm
Re: userChrome.css not working on newly installed FF
My thanks also to everyone who helped get Firefox working as it was pre-65.
The last link provided by arturox contained the minimum number of lines needed to put those Tabs on the Bottom.
Relwasw 66 is supposed to be a major update. I hope they leave the UI alone next time.
The last link provided by arturox contained the minimum number of lines needed to put those Tabs on the Bottom.
Relwasw 66 is supposed to be a major update. I hope they leave the UI alone next time.
- ineuw
- Posts: 743
- Joined: March 19th, 2006, 4:17 pm
- Location: Québec, Canada
Re: userChrome.css not working on newly installed FF
arturox thanks for the solution. it works for me. Peace reigns in the kingdom again.
Firefox 115.0.2 (default install) in Linux Mint 21.2 Cinnamon 64 bit, updated on 2023-07-31 00:05
-
- Posts: 246
- Joined: September 7th, 2003, 10:09 am
Re: userChrome.css not working on newly installed FF
This is great--1 more thing--maybe--is there a way as in pre 65--to collapse the tab bar when no tabs are showing--I have a long blue empty bar across the screen when no tabs are showing. The lines in my .css file don't seem to make it do this anymore.
Many thanks
Many thanks
- Grumpus
- Posts: 13246
- Joined: October 19th, 2007, 4:23 am
- Location: ... Da' Swamp
Re: userChrome.css not working on newly installed FF
This code worked, part from one of the links and part addition for removal of the haze.
Code: Select all
@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: 27px !important; /* adjust to suit your needs */
}
:root #tabbrowser-tabs {
--tab-min-height: 27px !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;
}
#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;
}
/* Remove Haze NavBar */
#nav-bar,
#PersonalToolbar {
background: transparent !important;
}
Last edited by Grumpus on January 31st, 2019, 10:27 am, edited 1 time in total.
Doesn't matter what you say, it's wrong for a toaster to walk around the house and talk to you
- RobertJ
- Moderator
- Posts: 10880
- Joined: October 15th, 2003, 7:40 pm
- Location: Chicago IL/Oconomowoc WI
Re: userChrome.css not working on newly installed FF
Try .titlebar-buttonbox instead of #titlebar-buttonboxExoteeth wrote:I had no idea until now that I installed Firefox 65. This is also probably why the prefs file didn't work right (i used the prefs file from the previous version). It also might explain why my CSS doesn't work right.
#titlebar-buttonbox-container no longer works in 65.
.
FF 92.0 - TB 78.13 - Mac OSX 10.13.6
-
- Posts: 120
- Joined: July 2nd, 2004, 3:52 pm
- Location: North Idaho, USA
Re: userChrome.css not working on newly installed FF
Thanks to all, especially Grumpus for the fix. I can not understand why Mozilla does not give us a choice--this is such simple piece of code to implement--if you know what your are doing. Come on Mozilla--listen to to your customers!
-
- Posts: 2
- Joined: January 31st, 2019, 11:11 am
Re: userChrome.css not working on newly installed FF
So I have these two codes:
1) Puts tabs on bottom:
2) Close tab bar with only one tab:
Both work perfectly separately on 65, but put them together and 2) fails to remove the bar. Any suggestion on getting them working together? Or perhaps get them to run separate from each other (eg: disable 1) if there's only 1 tab, disable 2) when running multiple tabs)?
1) Puts tabs on bottom:
Code: Select all
/* 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;}
#TabsToolbar {
height: var(--tab-min-height) !important;
margin-bottom: 1px !important;
box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !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;
}
Code: Select all
/* hide tab bar if only one tab */
tab:only-of-type {
display:none !important;
}
/* unset the tab bar min-height */
#tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox, #tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {
min-height: initial !important;
}
/* set the height on the tabs instead */
tab {
line-height: 32px; height: 32px;
}
/* hide new tab button so tab-bar can collapse */
.tabs-newtab-button {
display: none;
}
/* ...but show it on tab-bar hover */
#tabbrowser-tabs:hover .tabs-newtab-button {
display: block;
}
#TabsToolbar {
min-height: 0px !important;
}
-
- Posts: 63
- Joined: April 8th, 2004, 11:20 am
- Contact:
Re: userChrome.css not working on newly installed FF
I used this code from Grumpus and placed it in a file named userChrome.css. This file was then placed in folder chrome in Profiles. Also placed chrome in the default profile folder. Tabs are still on top.What am I doing wrong?
Grumpus wrote:This code worked, part from one of the links and part addition for removal of the haze.Code: Select all
@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: 27px !important; /* adjust to suit your needs */ } :root #tabbrowser-tabs { --tab-min-height: 27px !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; } #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; } /* Remove Haze NavBar */ #nav-bar, #PersonalToolbar { background: transparent !important; }
-
- Posts: 120
- Joined: July 2nd, 2004, 3:52 pm
- Location: North Idaho, USA
Re: userChrome.css not working on newly installed FF
To my very limited knowledge--there is only 1 place you want this chrome folder--and that is here---on my computer:
C:\Users\r\AppData\Roaming\Mozilla\Firefox\Profiles\uw9r7k1c.default
C:\Users\r\AppData\Roaming\Mozilla\Firefox\Profiles\uw9r7k1c.default
-
- Posts: 63
- Joined: April 8th, 2004, 11:20 am
- Contact:
Re: userChrome.css not working on newly installed FF
As soon as I changed the folder from Local to Roaming it worked. Thank you.ronbo wrote:To my very limited knowledge--there is only 1 place you want this chrome folder--and that is here---on my computer:
C:\Users\r\AppData\Roaming\Mozilla\Firefox\Profiles\uw9r7k1c.default
Last edited by oldtraveler on January 31st, 2019, 12:30 pm, edited 1 time in total.
-
- Posts: 120
- Joined: July 2nd, 2004, 3:52 pm
- Location: North Idaho, USA
Re: userChrome.css not working on newly installed FF
I assume you are using FF65.0. If u r using earlier version--you may need a different .css file. Try restarting your computer--I did not need that--just restarting FF 65.0 worked fine.
- Mudder
- Posts: 95
- Joined: July 7th, 2013, 4:14 pm
- Location: Ontario, Canada
Re: userChrome.css not working on newly installed FF
Two thumbs up, but so far 65 isn't blocking any of my favourite sites.ineuw wrote:Of course users are making it a big deal, it's a desired feature that users are missing. This is a very bad attitude on part of Mozilla who touted Firefox as a different kind of product from Microsoft Explorer and which encouraged user input.
-
- Posts: 2
- Joined: January 31st, 2019, 11:11 am
Re: userChrome.css not working on newly installed FF
Got a solution for this, in case anyone stumbles on it:Leafsdude wrote:So I have these two codes:
1) Puts tabs on bottom:
2) Close tab bar with only one tab:
Both work perfectly separately on 65, but put them together and 2) fails to remove the bar. Any suggestion on getting them working together? Or perhaps get them to run separate from each other (eg: disable 1) if there's only 1 tab, disable 2) when running multiple tabs)?
Code: Select all
/* Modify to change window drag space width */
:root[tabsintitlebar="true"] #nav-bar{ --window-drag-space-width: 24px }
.titlebar-buttonbox-container{
position: fixed;
top:0;
right:0;
height: 40px;
}
#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }
:root[sizemode="maximized"] > #navigator-toolbox{ padding-top: 8px !important; }
:root[sizemode="maximized"] .titlebar-buttonbox-container{ top: 8px }
:root[uidensity="compact"] .titlebar-buttonbox-container{ height: 32px }
.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }
#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
}
:root[tabsintitlebar="true"] #nav-bar{
padding-right: calc(138px + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,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; }
/* Menubar on top patch - use with Fx65_tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */
#navigator-toolbox{ margin-top: 22px }
#toolbar-menubar{
position: fixed;
top: 0px;
height: 22px;
margin-top:1px;
width: 100%;
overflow: hidden;
}
#toolbar-menubar .titlebar-buttonbox-container{ height: 22px; }
#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }
/* This will allow you to MAYBE put some items to the menubar */
#toolbar-menubar > *{ float: left }
#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }
/* Makes tabs toolbar items zero-height initially and sets enlarge them to fill up space equal to tab-min-height set on tabs */
/* Firefox 65+ only */
/* !!USER!! - REMOVE ALL BUTTONS you can from the tabs toolbar */
/* Configurable window drag space */
:root[sizemode="normal"] #nav-bar{ --window-drag-space-width: 20px }
#titlebar{ -moz-appearance: none !important; }
#tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox{ min-height: 0 !important; }
:root:not([customizing]) #tabbrowser-tabs .tabs-newtab-button,
:root:not([customizing]) #TabsToolbar .titlebar-button{
-moz-appearance: none !important;
height: 0px;
padding-top: 0px !important;
padding-bottom: 0px !important;
-moz-box-align: stretch;
margin: 0 !important;
}
#tabbrowser-tabs .tabbrowser-tab{ height: var(--tab-min-height) }
#tabbrowser-tabs .tabbrowser-tab[first-visible-tab="true"][last-visible-tab="true"]{
visibility: collapse !important;
}
/* Button re-styling */
#tabbrowser-tabs .tabs-newtab-button:hover{ background-color: var(--toolbarbutton-hover-background) }
#tabbrowser-tabs .tabs-newtab-button > .toolbarbutton-icon{
padding: 0 !important;
transform: scale(0.6);
background-color: transparent !important;
}
/* Extra top padding in maximized window */
:root[sizemode="maximized"] > #navigator-toolbox{ padding-top:7px !important; }
/* Fix window controls not being clickable */
#toolbar-menubar:hover{
min-height: calc(var(--tab-min-height) + var(--space-above-tabbar) - 1px) !important;
height: calc(var(--tab-min-height) + var(--space-above-tabbar) - 1px) !important;
-moz-appearance: initial !important;
}
#nav-bar{ padding: 0 var(--window-drag-space-width,0px) }
-
- Posts: 246
- Joined: September 7th, 2003, 10:09 am
my try at it
cannot get anything to hide the bar--but can hide 1 tab, and thinned down the bar and colored it to be same as a blank page with FF dev tool eyedropper tool--sorry these are so big--don't do this enough
this is 1 with an almost blank page--no tab showing--but the tab bar is colored the same as if i had no page open, it's right under the bookmarks bar
> https://i.imgur.com/H8FSIiX.jpg?1
this is the weather page open--no tab (1 Tab hidden)--the bar thinned down narrow to be not as annoying--right under my bookmarks bar
> https://i.imgur.com/1BmyIXD.jpg?1
this has 4 tabs on thinned down bar under bookmarks bar--3 red are loaded but not being read, the blue is the one being now, FF forum, red lets me go back to any of the other pages--say the Florida forum, it would then go blue.
> https://i.imgur.com/hIA24Zt.jpg?1
all the code was taken from the work of other people posted, they are the ones, I'm not a programmer, just wish I could hide the bar with 1 tab as before, it just doesn't work on ,my comp
this is 1 with an almost blank page--no tab showing--but the tab bar is colored the same as if i had no page open, it's right under the bookmarks bar
> https://i.imgur.com/H8FSIiX.jpg?1
this is the weather page open--no tab (1 Tab hidden)--the bar thinned down narrow to be not as annoying--right under my bookmarks bar
> https://i.imgur.com/1BmyIXD.jpg?1
this has 4 tabs on thinned down bar under bookmarks bar--3 red are loaded but not being read, the blue is the one being now, FF forum, red lets me go back to any of the other pages--say the Florida forum, it would then go blue.
> https://i.imgur.com/hIA24Zt.jpg?1
all the code was taken from the work of other people posted, they are the ones, I'm not a programmer, just wish I could hide the bar with 1 tab as before, it just doesn't work on ,my comp
Last edited by LIMPET235 on February 3rd, 2019, 6:35 am, edited 1 time in total.
Reason: Image tags removed to restore the forum layout.
Reason: Image tags removed to restore the forum layout.
- Ashleyj
- Posts: 218
- Joined: September 9th, 2004, 12:10 pm
Re: userChrome.css not working on newly installed FF
Excuse me for being thick but I can't seem to get this to work for me.
I was using a custom css file that I got from Github (Aris-t2) that was working fine with the tabs below the toolbars.
I have read all the posts in this thread but I'm confused about what I actually have to do. I followed the link to the code as suggested by Arturox and copied it to paste into my css file.
Now these are my questions -
1. It talks of pasting it below the default @namespace line. Looking at my existing css file I can't see any line starting @namespace, in fact it says at the start of the file - "CSS tweaks won't work, if '@namespace' references are used inside .css files!" So where do I paste the new code?
2. Do I have to delete the existing code that originally fixed the tab position -
/************************************************************************************************/
/* TABS TOOLBAR POSITION (below titlebar / below navigation toolbar / below main content) *******/
/************************************************************************************************/
/* only use one at a time - below titlebar OR below navigation bar OR below main content ********/
/* etc.
I have tried various combinations of pasting and deleting but nothing seems to work.
Hope someone can help, thanks.
I was using a custom css file that I got from Github (Aris-t2) that was working fine with the tabs below the toolbars.
I have read all the posts in this thread but I'm confused about what I actually have to do. I followed the link to the code as suggested by Arturox and copied it to paste into my css file.
Now these are my questions -
1. It talks of pasting it below the default @namespace line. Looking at my existing css file I can't see any line starting @namespace, in fact it says at the start of the file - "CSS tweaks won't work, if '@namespace' references are used inside .css files!" So where do I paste the new code?
2. Do I have to delete the existing code that originally fixed the tab position -
/************************************************************************************************/
/* TABS TOOLBAR POSITION (below titlebar / below navigation toolbar / below main content) *******/
/************************************************************************************************/
/* only use one at a time - below titlebar OR below navigation bar OR below main content ********/
/* etc.
I have tried various combinations of pasting and deleting but nothing seems to work.
Hope someone can help, thanks.