CSS “aspect-ratio: 1” is being incorrectly marked as an error
URL being validated or code to reproduce error: https://webplatform.news
Error: CSS: aspect-ratio: 1 is not a aspect-ratio value.
At line 106, column 17
aspect-ratio: 1;↩}↩↩/* MAIN *
Link to report: https://validator.w3.org/nu/?doc=https%3A%2F%2Fwebplatform.news
OK, pinging @ylafon, since I can reproduce this at https://jigsaw.w3.org/css-validator/validator?uri=https://webplatform.news/ — so this issue isn’t specific to the HTML checker but instead is an upstream issue with the CSS-checking backend.
Indeed, the definition of ratio in the css validator is way outdated. I opened an issue to track that.
@ylafon do we have any roadmap for this?
Hi, this is still failing, values like aspect-ratio: 1, aspect-ratio: 1.5 or aspect-ratio: 2.666666667 will fail but all will pass if we explicitly add the height denominator: aspect-ratio: 1/1, aspect-ratio: 1.5/1, etc., which shouldn't be needed as the spec says it defaults to 1.
Let me just add, that aspect-ratio: 1; is also how core WordPress outputs its square 1:1 aspect ratio, meaning the editor or content creator has no influence on the markup, and can not, for instance, just enter 1:1 (instead of just 1), to satisfy the validator.
Meaning all square aspect ratios, often used for thumbnails, headshots etc in WordPress, will cause false positive when validating.
That, again, means we've got not choice but to tell people to ignore the errors in the validator, and that is a slippery slope, as valid HTML is a cornerstone of accessible web development.
🤔
Just to note that it was fixed upstream (see right above).