@-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
HTML5 Canvas - Fill Circle with Image
Linethrough/Strikethrough a Whole HTML Table Row
Make Anchor Links Refer to The Current Page When Using <Base>
Display Background Color for The Page & Align Texts at Center
What Is a Non-Replaced Inline Element
R: Saving Multiple HTML Widgets Together
Textarea Value Not Getting Posted with Form
HTML Maxlength Attribute Not Working on Chrome and Safari
How to Vertically Align a Table in CSS
How to Send HTML Email Using R
Create Line Numbers on Pre with CSS Only
How Does Stackoverflow Make Its Tag Input Field
Why Is a Trailing Punctuation Mark Rendered at The Start with Direction:Rtl