[csswg-drafts] [css-values-4] Allow an inline way to do "first value that's supported" (#5055)

tabatkins has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-values-4] Allow an inline way to do "first value that's supported" ==
When authors use `var()`, the UA to assume that the property value is valid at parse time, and only check at computed-value time. If it ends up not being valid, it becomes invalid-at-computed-value-time, reverting to either `initial` or `inherit`.

This, unfortunately, loses us CSS's very useful forward-compatibility feature, where we can specify a property two or more times with different features and get the last one the UA supports. Instead we get the last one the UA supports *or* that has a `var()` in it, even if the `var()`-containing one uses features the UA ends up not understanding!

Making this worse, more features are ending up requiring `var()`-like parsing - attr(), custom functions, etc - so this will only get more common. It would be pretty unfortunate to lose the forward-compatibility feature for a large swathe of CSS usage.

An author can, of course, work around this with @supports. Unfortunately, it has the same separation/repetition/verbosity issues as MQs do, as explained in #5009.

So, related to #5009, perhaps we could have a "validity switch" in the same way? It'd be one of those "must be the whole value of the property" things, and using the same fallback logic as normal CSS, it would resolve to the last item the UA understands. It would just do it at computed-value time, so post-substitution.

So something like:

```css
:root {
  --fg: last-supported(blue; lch(30% 130 300));
}
.foo {
  color: var(--fg);
}
```

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5055 using your GitHub account

Received on Friday, 8 May 2020 16:09:07 UTC