Skip to content

[css-variables] Animation tainting text doesn't cover the cases where a property references a tainted property #1737

Closed
@FremyCompany

Description

@FremyCompany

I don't think the text in the spec covers this example:

div { 
	animation: anim 1s infinite alternate; 
	--var: block; --var2: var(--var);
}

div::after {
	content: "abc";
	display: var(--var2);
}

@keyframes anim {
	to { --var: none; }
}

https://drafts.csswg.org/css-variables/#substitute-a-var

If the custom property named by the first argument to the var() function is animation-tainted [... ignore it in display if it resolves to none ...]

any custom property used in a @keyframes rule becomes animation-tainted, which affects how it is treated when referred to via the var() function in an animation property.

var2 is never used in a keyframes rules so should not be animation tainted

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions