CSS Values and Units Level 4 introduces the mix()
function. It's not clear to me reading the spec at what point clamping should be applied for this example:
<div style="font-size: 40px; line-height: mix(0.5, 40px, calc(40px - 3em))"></div>
The spec has this to say in the Range Checking section for calc():
Parse-time range-checking of values is not performed within math functions, and therefore out-of-range values do not cause the declaration to become invalid. However, the value resulting from an expression must be clamped to the range allowed in the target context.
I'm not sure what "resulting from an expression" means here. I think the above mix()
value could resolve to either:
20px
where we clamp the output of the calc()
expression and mix between 40px
and 0px
,0px
where we only clamp the output of the entire mix()
expression and mix between 40px
and -80px
, clamping the result -20px
to 0px
Assuming that "resulting from an expression" refers to any math function then it would clearly be the first result since mix()
is not a math function.
This is somewhat related to #8157 where I raised the issue of what would happen when interpolating between the same two values in the context of an animation.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.3