UserChrome.css broken in FF 10.0.2 and Nightly 13.0a1?

I noticed with the FF 10.0.2 update that userChrome.css is no longer being applied. To test, I created a new profile with no addons or extensions, and a single modified CSS value (to opacify the titlebar) in userChrome.css. It doesn't work as usual or expected (no result at all). I noticed that Nightly 13.0a1 is also affected. Here's the one CSS value I pared the userChrome down to: 
 
<pre><nowiki>#TabsToolbar {
background-color: -moz-dialog !important;
</nowiki></pre>
Thanks

That tab bar already has that background-color: -moz-dialog !important; rule, but there is another rule that sets a background-image
<pre><nowiki>background-image: -moz-linear-gradient(50% 100%, rgba(0, 0, 0, 0.3) 1px, rgba(0, 0, 0, 0.05) 1px, transparent 50%);
</nowiki></pre>
You probably need to add a -moz-appearance: none !important; rule and may also need to disable background images or set a different background image instead.
See line 27 and line 1429 in:
* chrome://browser/skin/browser.css

Similar Messages

Problem with userchrome.css being effective in Hebrew versions of Firefox

Hi,
I am trying to remove the Tools menu in Firefox on certain student computers (I am the systems administrator in a small college).
After searching around the internet I was able to put together a userchrome.css file, I placed it in the correct folder and it indeed removed the Tools menu.
However, I later noticed that it seems to work only on computers with English-language Firefox, and did not work on other computers that had Hebrew-language Firefox.
Specifically, it worked on versions 3.6.12 and 3.6.24 in English, and did not work on versions 3.6.12 or 6.01 in Hebrew. Note that I tested the same version (3.6.12) in both Hebrew and English, and therefore I concluded that the Hebrew-language interface is what is causing the problem.
Here is the gist of the userchrome.css file I tried:
* Do not remove the @namespace line -- it's required for correct functioning
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
menu[label="Tools"] {
display: none !important;
I did try replacing the word "Tools" with its Hebrew-language equivalent as it appears in Hebrew Firefox, but that didn't work either.
Does anybody have any information on using userchrome.css on Hebrew Firefox (or on non-English versions of Firefox)?
Thanks,
-Michael

It would be better to lock the related prefs if you want to prevent user s from making changes to settings.
Use a mozilla.cfg file in the Firefox program folder to lock prefs or specify default values. 
Place a file local-settings.js in the defaults\pref folder where you also find the file channel-prefs.js to specify using mozilla.cfg.
pref("general.config.filename", "mozilla.cfg");
pref("general.config.obscure_value", 0); // use this to disable the byte-shift
See:
* http://kb.mozillazine.org/Locking_preferences
You can use these functions in mozilla.cfg:
defaultPref(); // set new default value
pref(); // set pref, but allow changes in current session
lockPref(); // lock pref, disallow changes

Not able to find userChrome.css file for customizing the Firefox browser. I just installed 20.0.1 firefox browser. Want to disable/remove navigation bar.Pls Hlp

Not able to find userChrome.css file for customizing the Firefox browser. I just installed 20.0.1 Firefox browser version.
I want to disable/remove navigation bar from the browser window, making the browser to work like kiosk mode.
Please Help,
Thanks,
Vishal.

hello,
here is the complete path ..
''C:\Documents and Settings\XXXXXXX\Application Data\Mozilla\Firefox\Profiles\chrome"
Let me know
Thanks,
Vishal.

Making Firefox run as a bare content panel only 60px high using userChrome.css and localstore.rdf

I'm developing a web application for personal use, which due to extreme space constraints must be contained within a Firefox window measuring exactly 60px high by 331px wide. The window must have all the controls and bordering removed and appear as a totally bare pane whilst retaining the ability to move between tabs using CTRL-TAB.
So far I've managed to remove all the controls and bordering and retain the CTRL-TAB functionality using the custom userChrome.css style sheet pasted below. I've added a 1px border to the bottom and right for clarity. Making #navigator-toolbox visibility:hidden instead of display:none enables CTRL-TAB to work without the navigator-toolbox being visible. Giving #tab-view-deck -85px top margin aligns the top of the web page with the top of the Firefox window. Setting #browser-border-end, #browser-border-start display:none removes the effective border to the left and right of the browser window. So far so good.
I then set the following parameters in localstore.rdf in the profile folder.
<pre><nowiki>
<RDF:Description RDF:about="chrome://browser/content/browser.xul#main-window"
height="149"
width="331"
screenX="0"
screenY="0"
sizemode="normal" /> </nowiki></pre>
The window appears perfectly at the top left of the screen and works exactly as specified. Unfortunately, when I reduce the height parameter to 60px, the window remains about 100px tall. I guess I'm missing some key important override rules in my userChrome.css or perhaps some other Firefox configuration settings need to be changed. Although it seems like a small difference, reducing the window from 100px to 60px will result in a massive design shift and a huge productivity gain. If you can help, I'd been extremely grateful. Thanks,
Neil
I'm using FF 33.0 and Windows 8.1.
Content of userChrome.css:
<pre><nowiki>
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
#main-window {
-moz-appearance:none !important;
#titlebar {
display: none !important;
#tab-view-deck {
border-bottom: 1px solid black !important;
border-right: 1px solid black !important;
margin: -85px 0px 0px 0px !important;
padding: none !important;
#tab-view-deck * {
border: none !important;
margin: none !important;
padding: none !important;
#navigator-toolbox {
visibility: hidden !important;
#browser-border-end, #browser-border-start {
display: none !important;
</nowiki></pre>
''added the forum code for displaying css code properly''

For some reason the userChrome.css has not posted correctly. Each instance of 1. should be replaced with # denoting an ID selector.

How do I show the bookmarks toolbar while in fullscreen on Firefox 20? In older versions you could edit the userChrome.css file. Does that still exist?

After searching for this option, it appears it was very easy to do in older versions of firefox on windows 7. Many posts say you can edit the userChrome.css file to add:
#PersonalToolbar[moz-collapsed="true"] {
visibility: visible !important;
However, on 2 machines with firefox 20, I've searched for that file and cannot find it. Does it even exist any more? if not, how can I set firefox to go to fullscreen mode and continue to show the bookmarks toolbar? Unchecking hide toolbars does not work for the bookmarks toolbar.

userChrome.css does not exist by default. You can create it; it's an ordinary text file. Note that you do need a namespace at the beginning of the file.
You could try this:
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
#PersonalToolbar[moz-collapsed="true"]{
visibility: visible !important;
#navigator-toolbox[inFullscreen="true"]{
margin-top:-62px !important;
I added the second rule to prevents the toolbar area from rolling all the way up. The specific value may need to be adjusted by a few pixels depending on your toolbar heights.

Is there a way to disable tab font smoothing (maybe with userchrome.css)?

hello everyone I've just switched from chrome to ff and I'm very satisfied. Just one problem, is there a way to disable tab font smoothing (maybe with userchrome.css)? I've changed the colour of tab font (with userchrome.css) to white to improve readability but with white text is too bold. thanks !!

hey thanks for the quick reply. here's a screenshot
http://www.mediafire.com/view/?c2a2l69ci5zbq#bt6qrwr6ku8m5n6
i think we just have to add some antialiasing in the userchrome.css? but i don't know the code.
here's my modified userchrome.css
/* Inactive Tab */
tab:not([selected="true"]) {
color:white !important;}
/* Tab while loading */
tab[busy] {
color: blue !important;}
tab .tab-text {
font-size: 12px !important;
/* tab font */
tab .tab-text {
font-family:Verdana !important;
i read somewhere else the problem is more evident with white text on dark background
thanks

How to adjust userChrome.css to move the #identity-icon-label to the right side of the #urlbar?

I hate the way the #identity-icon-label moves the URL over to the right. I've applied a patch to just hide it, but I'd rather make it behave more like IE8 and just have that box show up way over at the right end of the #urlbar.
So far, my customization experiments in userChrome.css havent yielded the desired result. Also, I thought it would be nice for someone else to be able to search and find a solution to this issue. (If it can be answered.)
Thanks :)

Try code like this to set the wanted order.
<pre><nowiki>
#urlbar .textbox-input-box {-moz-box-ordinal-group:1!important}
#identity-box {-moz-box-ordinal-group:2!important}
#urlbar-icons {-moz-box-ordinal-group:3!important}
</nowiki></pre>

FF9 - can i hide window control buttons in titlebar (min, max, close) with userchrome.css?

I use FF9. In userscript.css i hide titlebar and orange app button, but window control buttons still visible! I just can`t find working script.
I dont need min-max-close button and wont to hide it without extension if possible.
Here is screenshort:
http://s018.radikal.ru/i522/1201/50/f6a6ea445507.jpg

Try this code in userChrome.css below the default @namespace line.
*http://kb.mozillazine.org/userChrome.css
The customization files userChrome.css (interface) and userContent.css (websites) are located in the chrome folder in the user profile folder.
*http://kb.mozillazine.org/Editing_configuration
<pre><nowiki>*http://www.mozilla.org/en-US/firefox/channel/
#titlebar-buttonbox { display:none!important; }
</nowiki></pre>

I am trying to hide the Options menu in UserChrome.css but it is not working. Here is what I have tried menuitem[label="Options..."] {display:none !important;}

In the userChrome.css I have tried the following entry: #updateSeparator, #checkForUpdates {display: none !important;}
menuitem[label="Options..."] {display:none !important;}
menuitem[label="Add-ons"] {display:none !important;}
menuitem[label="Get Bookmark Add-ons"] {display:none !important;}
The other lines work, but the line to hide the Options menu does not. This in on Windows 32-bit XP sp3.

It is an ellipsis (…) and not three dots.
If there is an ID for a menu entry like in this case #menu_preferences then it is better to use that ID.
<pre><nowiki>#menu_preferences, #menu_openAddons, {display:none!important;}</nowiki></pre>
"Get Bookmark Add-ons" is a normal bookmark that you can remove via the right-click context menu or move elsewhere.

UserChrome.css works on XP but not on Windows 7

Hello.
I have modified userChrome.css which mainly fiddles with tab widths based on if it is selected or not. This works fine on XP but does absolutely nothing on Windows 7.
Any idea where to start looking the reason for this? What is different in Win7 regarding dealing with tabs?

Nevermind, turns out that FF just didn't close properly when I was editing that file, after forcing it to close using taskmanager and starting again that userchrome.css worked just fine. Bug in closing the FF in this case.

Where can I find "\chrome\userChrome.css" of Firefox 5 in Win7

Hi Guys
I can't find folder "chrome" in C:\Users\<Windows login/user name>\AppData\Roaming\Mozilla\Firefox\Profiles\<profile folder> any more.
What's changed in firefox5. Now i want to change something in userChrome.css. What should i do?

You need to create a new text file userChrome.css if that file doesn't exist yet. 
If you have an example file userChrome-example.css then you can rename that file.
Make sure that the file starts with an @namespace line.
<pre><nowiki>@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */
</nowiki></pre>
See:
* http://kb.mozillazine.org/Editing_configuration
* http://kb.mozillazine.org/Editing_configuration/Manual_editing
* http://kb.mozillazine.org/Editing_configuration/Troubleshooting

Need some help with Firefox and userChrome.css

As you can see there is some space underneath the tabs. I used the addon 'Classic theme restorer' to hide the adressbar, but unfortnanly it left some space underneath the tabs. I've been trying to fix it with userChrome.css myself, but I really dont know what am I'm doing.
Does anyone know how to remove it?

*For Safari (4.0.2)* I just clicked help>installed_plug-ins and get this:
http://www.easy-share.com/1908259228/Installed Plug-ins.html
*Firefox (3.5.3)* tools>add-ons>extensions: Ad Block plus
and tools>add-ons>Plug-ins: http://yfrog.com/6qnag2j
Message was edited by: Jonnymont
If I just delete these won't it make things worse? like not being able to go to any flash sites at all (majority of internet these days)
Message was edited by: Jonnymont

#bookmarksBarContent toolbarbutton modifications in userChrome.css no longer working

In firefox 3.x I use a userChrome.css in, among other things, I hide the folder icons and the 'drop-down' "arrow" icon in order to reduce space used, with the following:
<pre><nowiki>/* Remove Bookmark Item Icons */
#bookmarksBarContent toolbarbutton:not([type=menu]) image {
display: none !important;
-moz-margin-end: 0px !important;
/*Hide Bookmark Folder Icon*/
#bookmarksBarContent toolbarbutton[type=menu] image {
display: none !important;
-moz-margin-end: 0px !important;
#bookmarksBarContent toolbarbutton[container="true"] .toolbarbutton-menu-dropmarker {
display: none !important;
}</nowiki></pre>
This is now longer working in firefox 4.0b6. Can someone tell me how to do this in firefox 4 ?
Thanks much

Use #personal-bookmarks as selector. That should work in both versions.
<pre><nowiki>/* Remove Bookmark Item Icons */
#personal-bookmarks toolbarbutton:not([type=menu]) image {
display: none !important;
-moz-margin-end: 0px !important;
/*Hide Bookmark Folder Icon*/
#personal-bookmarks toolbarbutton[type=menu] image {
display: none !important;
-moz-margin-end: 0px !important;
#personal-bookmarks toolbarbutton[container="true"] .toolbarbutton-menu-dropmarker {
display: none !important;
}</nowiki></pre>
The menu button have ID #bookmarks-menu-button and the bookmarks have ID #PlacesToolbar

Hide go arrow in navigation bar, can't seem to find the selector to edit in userChrome.css

I used edits to userChrome.css to hide several items from the address bar, but I can't seem to find the right selector for the arrow that appears when you start typing in the address bar. So now it is the only thing there and it's driving me crazy. I have spent over an hour trying to figure it out with inspector addons and searching the web. I'm about to lose my mind. Obviously this is an insignificant thing to spend more than an hour on. Hopefully you can help me solve it relatively quickly.

Yes, that is the Go button. That button appears when you edit the URL on the location bar and can be used instead of the enter key.
Did you try that selector?
<pre><nowiki>#urlbar-go-button { display:none!important; }</nowiki></pre>

Css broken on forums?

is css broken on the forum at the moment? i'm getting just vanilla html with no style/graphics
or it just me having trouble?
i've accessed the forums from two different computers with different browsers - same problem on both
but i'm behind a particularly flakey proxy firewall this morning, so that could be why

ah, it's fine from outside the proxy server

UserChrome.css broken in FF 10.0.2 and Nightly 13.0a1?

Similar Messages

Maybe you are looking for