Possibly don’t use customized properties in shorthand properties

Manuel Matuzović:

That an invalid customized property invalidates the complete declaration isn’t stunning, however I didn’t take into account it till I noticed considered one of my declarations break. I assume it’s simply good to know that, particularly in the event you’re working lots with customized properties.

This simply qualifies as a “gotcha” in CSS and is an efficient reminder that the cascade doesn’t know every little thing all on the similar time. If a customized property is invalid, the cascade received’t ignore it, and it will get evaluated, which invalidates the declaration. And if we set an invalid customized property on a shorthand property that mixes a number of constituent properties — like how background and animation are each shorthand for a bunch of different properties — then the complete declaration turns into invalid, together with all the implied constituents. No bueno certainly.

What to do, then?

So, possibly don’t use customized properties in shorthand properties or use customized properties however don’t use shorthand properties.

Nice recommendation, Manuel!

---

Possibly don’t use customized properties in shorthand properties initially revealed on CSS-Methods, which is a part of the DigitalOcean household. It is best to get the e-newsletter.