This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

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

url filter doesn't work in userContent.css

  • 23 respostas
  • 8 have this problem
  • 1 view
  • Last reply by nimnull22

more options

Linux x86_64, Firefox 28

In my userContent.css I have:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain(www.utro.ru)
{
  * {
    font-family: "Arial" !important;
    font-size:   10px !important;
    }
}


  * {
    font-family: "Verdana" !important;
    font-size:   15px    !important;
    line-height: 1.3em   !important;
  }
  h1, h2, h3, h4, h5, h6 {
    font-family: Verdana !important;
    font-size: 13px !important;
    font-weight: bold !important;
  }

What I expected is to see "www.utro.ru" with Arial font and 10 px size Other pages - with Verdana font and 15px size. But in reality Firefox draws every page with Verdana 15px.


If I remove every other conditions:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain(www.utro.ru)
{
  * {
    font-family: "Arial" !important;
    font-size:   10px !important;
    }
}

Firefox starts to draw is expected - Arial 10px. Other pages with default font from configuration.

Is it another bug or I did something wrong? Firefox ignores more then one url filter condition!

Linux x86_64, Firefox 28 In my userContent.css I have: <pre><nowiki>@namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain(www.utro.ru) { * { font-family: "Arial" !important; font-size: 10px !important; } } * { font-family: "Verdana" !important; font-size: 15px !important; line-height: 1.3em !important; } h1, h2, h3, h4, h5, h6 { font-family: Verdana !important; font-size: 13px !important; font-weight: bold !important; }</nowiki></pre> What I expected is to see "www.utro.ru" with Arial font and 10 px size Other pages - with Verdana font and 15px size. But in reality Firefox draws every page with Verdana 15px. If I remove every other conditions: <pre><nowiki>@namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain(www.utro.ru) { * { font-family: "Arial" !important; font-size: 10px !important; } }</nowiki></pre> Firefox starts to draw is expected - Arial 10px. Other pages with default font from configuration. Is it another bug or I did something wrong? Firefox ignores more then one url filter condition!

cor-el modificouno o

Chosen solution

nimnull22 wrote:

Thank you. Your solution works as expected.

You're welcome.

nimnull22 wrote:

How to exclude one site.

Here's an example of a global style with an exception. Just replace the placeholders with actual domain names. Add another | symbol followed by the domain name to add another exception.


@-moz-document regexp("https?://(?!(utro.ru|example-of-an-exception.com|www.placeholder.site-exception.net)).*") {

/* The following is for all sites except Utro.ru */
* { font-family: "Comic Sans MS" !important; }

}

/* The following is just for support.mozilla.org
It will override the global declaration above */
@-moz-document domain("support.mozilla.org") {

* { font-family: "Times New Roman" !important; }

}

Ler a resposta no contexto 👍 0

All Replies (20)

more options

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain(www.utro.ru) {

 * {
   font-family: "Arial" !important;
   font-size:   10px !important;
   }

}

You've closed the @-moz-document at-rule at that point. Everything that follows isn't restricted to the aforementioned domain.


* {
   font-family: "Verdana" !important;
   font-size:   15px    !important;
   line-height: 1.3em   !important;
 }
 h1, h2, h3, h4, h5, h6 {
   font-family: Verdana !important;
   font-size: 13px !important;
   font-weight: bold !important;
 }

The above isn't inside a @-moz-document at-rule, so it will apply to all web pages.

Also, there's no point in putting @namespace at-rules in userContent.css. Everything in it applies to the HTML namespace by default.

Gingerbread Man modificouno o

more options

That is exactly what I wanted. But it didn't happen. Firefox draws everything with second rule.

Firefox applies at-rule to the "3w.utro.ru" ONLY if there is no other rules. The question is why?

nimnull22 modificouno o

more options

You probably need to change the order of the rules and place the @-moz-document domain() or url(){} rules after the default rules as both have the same specificity (*) and the latter will take prevalence if both apply like in this case.

more options

nimnull22,

Can you verify if the problem is solved. If the problem is solved, Please mark this thread as solved by marking the solution. This will help other users experiencing similar problems find help faster and more efficiently.

I hope you continue using our products and thank you for contacting Mozilla Support.

more options

This is another bug. Firefox ignores font-family statement in userContent.css. It applies only font size.

Please check yourself - add to userContent.css:

 * {
   font-family: Verdana   !important;
   font-size:   12px          !important;
 }
more options

It is working fine here.

You can use the DOM Inspector to check if Firefox finds those rules (the built-in inspector doesn't show userContent.css rules).

more options

Unfortunately mine doesn't work. Here is my scenario: In font preferences I have for Western - Verdana. So FF already should draw every page by Verdana. Now I put in userContent.css:

* {
  font-family: Arial   !important;
  font-size:   12px          !important;
}

And reload FF, open page and nothing happened - all fonts are Verdana, but should be Arial.

more options

Did you place the rules in the correct order and first placed the default * {} rule and then the site specific rules like @-moz-document domain(www.utro.ru) {} after the default rules?

more options

nimnull22 wrote:

Firefox applies at-rule to the "3w.utro.ru" ONLY if there is no other rules. The question is why?

That's to be expected:

  1. It applies to all web sites.
  2. It's second, meaning it has higher priority.
#foo { color: red !important; }
#foo { color: black !important; }

The element's color will be black.

nimnull22 wrote:

In font preferences I have for Western - Verdana. […]
And reload FF, open page and nothing happened - all fonts are Verdana, but should be Arial.

If you've unchecked "Allow websites to choose their own fonts", then you can't override the web page fonts with a user style. That's perfectly normal and not a bug.

more options

I deleted everything and left only default * {} rule - for the test. So I decided to find out first does it work at all. In my Linux default * {} rule doesn't change the font.

more options

@ Gingerbread Man

If you've unchecked "Allow websites to choose their own fonts", then you can't override the web page fonts with a user style. That's perfectly normal and not a bug.

If I uncheck "Allow websites to choose their own fonts", FF won't use web page font at all, it will use mine from "Preferences->Content->Fonts&Colors->Advanced. What I can change with default * {} rule is the font size.

nimnull22 modificouno o

more options

So what is your setting of "Allow websites to choose their own fonts"?

more options

So what is your setting of "Allow websites to choose their own fonts"?

For a Western encoding - Verdana.

more options

What I mean is whether that box has a checkmark or not.
If this box doesn't have a checkmark then you can't modify the page style regarding some font settings and the font family setting as set via "Options > Content" will be used.

more options

@ cor-el

But why can I change a font size then via default * {} rule?

more options

"Allow websites to choose their own fonts" only has effect for the font-family and not for other font properties if that is what you are asking, that is what using "their own fonts" means.

more options

@ cor-el According to what you are saying it is impossible to change font-family with @-moz-document domain( ) {}, @-moz-document url( ) {}, @-moz-document regexp( ) {},

And if yes, so how can user change font-family for particular domain for example? My Opera perfectly changes any fonts with user.css.

nimnull22 modificouno o

more options
more options

nimnull22 wrote:

how can user change font-family for particular domain for example?
  1. Under Options - Content - Advanced, "Allow pages to choose their own fonts" must be enabled.
  2. In userContent.css, put global styles at the top. This wouldn't be an issue if you were using separate styles in Stylish.
  3. In Stylish or userContent.css,

/* The following is for all sites */
* { font-family: "Comic Sans MS" !important; }

/* The following is just for support.mozilla.org
It will override the global declaration above */
@-moz-document domain("support.mozilla.org") {

* { font-family: "Times New Roman" !important; }

}

more options

@ Gingerbread Man

Thank you. Your solution works as expected.

  1. 1
  2. 2