Repository navigation
attr() declaration with type function breaks parsing #4371
Description
To reproduce:
img {
aspect-ratio: attr(width type(<number>)) / attr(height type(<number>));
}Current behavior:
An exception: "Could not parse call arguments or missing ')'" is thrown.
Expected behavior:
img {
aspect-ratio: attr(width type(<number>)) / attr(height type(<number>));
}should be rendered
Environment information:
lessversion: 4.2.2nodejsversion: 22.17.0operating system: macos
Activity
dosubot commentedon Oct 13, 2025
puckowski commentedon Oct 16, 2025
Thank you for the bug report @janschoenherr
I'll try to experiment this weekend and see if I can come up with a solution.
rohan45327 commentedon Oct 20, 2025
Hi @janschoenherr I have been reviewed the bug and I also earlier encountered the same bug :
`img {
}`
To fix this try ~" " by wrapping the expression in :
`~"img{
}"`
this will tell less to treat as raw CSS. and The compiler will no longer throw Could not parse call arguments or missing ')' error
The resulting CSS works as expected in all modern browsers.
janschoenherr commentedon Oct 22, 2025
Hi @rohan45327,
thanks, that's what we currently do with uikit. It would still be nice, if we wouldn't have to use the workaround.
matthew-dean commentedon Oct 23, 2025
@janschoenherr Can you link to the spec where
type(<number>)(specifically<number>) is now a valid value?janschoenherr commentedon Oct 27, 2025
@matthew-dean This is still in draft: https://drafts.csswg.org/css-values-5/#attr-notation
Currently only Chrome supports it. I understand, if you want to delay supporting it until the spec is final.
https://wpt.fyi/results/css/css-values/attr-all-types.html?label=experimental&label=master&aligned&q=attr-all-types
matthew-dean commentedon Mar 10, 2026
@janschoenherr Until Firefox & Safari support it, it makes it effectively an unusable property.