Re:The attr() function in CSS now supports types
by scragz on Thursday August 21, 2025 @11:16PM
(#44980692)
first they came for my javascript, then my python... now css?! these type-heads need to chill.
[ Parent
| on HN ]
Re:The attr() function in CSS now supports types
by notpushkin on Thursday August 21, 2025 @11:21PM
(#44980709)
Eh, CSS is inherently typed. My only concern is, why specify types in attr() and not just infer them (like the rest of CSS does)?
Re:The attr() function in CSS now supports types
by eyelidlessness on Friday August 22, 2025 @01:28AM
(#44981285)
Because HTML attributes are inherently stringly typed. Where CSS can propagate types, it’s because the CSS parser and object model are involved. For that to work with attr() would almost certainly involve extending that machinery into all aspects of the HTML spec, and then all that machinery too. Which is probably impractical for more reasons than I can think of, but I can think of several.
Re:The attr() function in CSS now supports types
by degamad on Friday August 22, 2025 @01:42AM
(#44981366)
But in any context in which the attr() function is used, the type information is inherent, right?
min-width: attr(foo) /* implicitly requires type to be length */
color: attr(bar) /* implicitly requires type to be color */
Unless you wanted to use a shorthand property like border, but restrict the attribute to only one part of it? border: 1px attr(bdrcolor type(<color>)) /* needs explicit type to prevent specifying border-style */
But that would be easier and cleaner to specify separately? border-width: 1px
border-color: attr(bdrcolor) /* implicitly requires type to be color */
In what scenarios does adding the explicit type information help, rather than having the parser infer the type of the attr() based on the context of the call?
Re:The attr() function in CSS now supports types
by notpushkin on Friday August 22, 2025 @04:46AM
(#44982250)
Yeah, my thinking exactly.
CSS variables are another thing to consider perhaps. You can specify their type explicitly as well (albeit using a more verbose syntax):
@property --logo-color {
syntax: "<color>";
inherits: false;
initial-value: attr(logo-color);
}