@-Moz-Document Url-Prefix() Not Working

@-moz-document not working

On the surface it would seem to be because your @-moz-document appears before the float:none rule — so it will always get overridden regardless. The presence of a conditional at-rule does not change how the cascade works; this is a common gotcha with @media rules and applies just as well to @-moz-document.

You want to move it to the bottom so it will override the previous rule properly in Firefox:

<style>
.attempt {
float:none
}
@-moz-document url-prefix() {
.attempt {
float:left
}
}
</style>

<div class="attempt">someText</div>

Successor of @-moz-document url-prefix()

In FF V61 release channel and V59 Beta/Dev it was removed, the exception is the url-prefix() function, so your code should work, here is some info and code:

The @-moz-document rule is no longer available from Web content since
it could be used by attackers for CSS injection to steal private data
in the URL of third-party sites. Firefox users are still able to use
this rule in the user stylesheet to personalize their browsing
experience.

The at-rule support has already been removed from Nightly and early
Beta/DevEdition as of Firefox 59, and removed from all the channels
with Firefox 61.

An exception is the empty url-prefix function that has been used as a
CSS hack targeting Firefox. It continues to be parsed on the Release
channel to avoid breakages but will be removed in the near future once
major compatibility issues are solved

Source

In the current latest version (62.0.3) it still works, as you can see in this fiddle

and using your snippet:

.test{  background-color: red;}
@-moz-document url-prefix() { .test { background-color: blue; }}
<div class="test">test</div>

Unknown @ rule: @-moz-document for Stylish in Firefox 61

Mozilla nuked @-moz-document rules with Firefox version 61. It's supposed to be replaced with @document(link), but that doesn't work yet.

This needs to be addressed in Stylish. It would be best if the Import tool parses @-moz-document rules to its internal metadata and then strips the text on import, IMO.

I couldn't find anything about this new Firefox breakage in a quick search of the Stylish GitHub, so you may want to raise the issue over there.

As a temporary workaround, you can set the layout.css.moz-document.content.enabled pref to true in about:config.

That won't clear the red error X in the edit dialog, but the script will work.

Successor of @-moz-document url-prefix()

In FF V61 release channel and V59 Beta/Dev it was removed, the exception is the url-prefix() function, so your code should work, here is some info and code:

The @-moz-document rule is no longer available from Web content since
it could be used by attackers for CSS injection to steal private data
in the URL of third-party sites. Firefox users are still able to use
this rule in the user stylesheet to personalize their browsing
experience.

The at-rule support has already been removed from Nightly and early
Beta/DevEdition as of Firefox 59, and removed from all the channels
with Firefox 61.

An exception is the empty url-prefix function that has been used as a
CSS hack targeting Firefox. It continues to be parsed on the Release
channel to avoid breakages but will be removed in the near future once
major compatibility issues are solved

Source

In the current latest version (62.0.3) it still works, as you can see in this fiddle

and using your snippet:

.test{  background-color: red;}
@-moz-document url-prefix() { .test { background-color: blue; }}
<div class="test">test</div>

moz-document url-prefix not working for hyperlink

Use Firebug to check whether the css is applied, whether it has lower priority level than others.

Try

<style>
@-moz-document url-prefix() {
a.action1 {
outline: 0 none !important;
}
}
</style>


Related Topics



Leave a reply



Submit