Skip to content

[css-values-5] var() fallback containing a positioned {} #12625

@cdoublev

Description

@cdoublev

opacity: var(--custom, {} 1) is valid in Chrome and FF today but is invalid per spec:

the <declaration-value> defined for the fallback value of var() [...] follows the standard comma-containing production rules when it does start with a "{" token

The aforementioned related rule is:

If it does start with a "{" token, then the production matches just the {} block that the "{" token opens.

This was introduced following the resolution in #9539.

A positioned {} is valid only in a custom property value therefore any declaration value would be invalid at computed value time after substituting the fallback of var(--custom, {} 1) or var(--custom, 1 {}).

However, var(--custom, 1 {}) is valid, per spec:

the <declaration-value> defined for the fallback value of var() [...] ignores the rules restricting what it can contain when it does not start with a "{" token: it is allowed to contain commas and {} blocks.

So I suspect this breaking change is not intentional.

This was a follow-up of this comment.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions