Open ai opened 1 month ago
From css-color-5
: https://drafts.csswg.org/css-color-5/#relative-syntax
The channel keywords return a
<number>
; if they were originally specified as a<percentage>
or an<angle>
, that<percentage>
is resolved to a<number>
and the<angle>
is resolved to a<number>
of degrees (which is the canonical unit) in the range [0, 360].
The l
in calc(l - 10%)
is of type <number>
.
From css-values-4
: https://drafts.csswg.org/css-values-4/#mixed-percentages
More
<type-percentage>
productions can be added in the future as needed. A<number-percentage>
will never be added, as<number>
and<percentage>
can’t be combined incalc()
.
calc(l - 10%)
doesn't work because it is calc(0.1 - 10%)
/ calc(<number> - <percentage>)
which isn't possible following the css-values
spec
The most recent discussion about this can be found here : https://github.com/w3c/csswg-drafts/issues/9955
Hi, I just discovered a similar issue where relative colors don't work without declaring a degree unit.
Is this just an iOS/Safari issue?
Hi, I just discovered a similar issue where relative colors don't work without declaring a degree unit.
This has already been resolved in latest Safari Technical Preview
I found that this CSS doesn’t work in all browsers:
The only way to change lightness is to avoid
%
by usingcalc(l - 0.1)
.It looks confusing to me. But I don’t know what part of the spec prohibits it.
Demo: https://codepen.io/iskin/pen/GRabXPr