16f6c0aecf
Inline adoc files when they are included exactly once. Also fix language tags because this inlining gives us better information on what language the code is written in.
51 lines
932 B
Plaintext
51 lines
932 B
Plaintext
== Why is this an issue?
|
|
|
|
``++!important++`` within keyframes declarations is completely ignored in some browsers and therefore it should not be used to be consistent among all browsers.
|
|
|
|
|
|
=== Noncompliant code example
|
|
|
|
[source,css]
|
|
----
|
|
@keyframes kf {
|
|
from { margin-top: 50px; }
|
|
50% { margin-top: 150px !important; } /* Noncompliant; ignored */
|
|
to { margin-top: 100px; }
|
|
}
|
|
----
|
|
|
|
|
|
=== Compliant solution
|
|
|
|
[source,css]
|
|
----
|
|
@keyframes kf {
|
|
from { margin-top: 50px; }
|
|
50% { margin-top: 150px; }
|
|
to { margin-top: 100px; }
|
|
}
|
|
----
|
|
|
|
|
|
== Resources
|
|
|
|
* https://developer.mozilla.org/en-US/docs/Web/CSS/@keyframes#!important_in_a_keyframe[Mozilla Web Technology for Developers] - ``++!important++`` in a keyframe
|
|
|
|
ifdef::env-github,rspecator-view[]
|
|
|
|
'''
|
|
== Implementation Specification
|
|
(visible only on this page)
|
|
|
|
=== Message
|
|
|
|
Remove ``++!important++``.
|
|
|
|
|
|
=== Highlighting
|
|
|
|
!important
|
|
|
|
|
|
endif::env-github,rspecator-view[]
|