Re: [csswg-drafts] [css-borders] Add a 'hairline' border-width value (#3720)

So, here are the options:

1. Add a `hairline` keyword (so `border-width: hairline` works), and a `hairline` calc-keyword (so `width: calc(100px + 2 * hairline)` works).
2. Add a `hairline` unit (so `border-width: 1hairline` works, as does `width: calc(100px + 2hairline)`)
3. Add a function (so `border-width: border-round(0.1px)` works, as does `width: calc(100px + 2 * border-round(0.1px))`)

2 and 3 both have the advantage that they work everywhere, automatically, with no grammatical ambiguity. We don't have to review any existing properties, or keep this in mind with any future properties.

1 doesn't have that advantage. The plain keyword is grammatically ambiguous anywhere a length is mixed with an open set of keywords. We *mostly* nowadays make sure that open sets of keywords use dashed-idents, but it's still not 100%, and there are several legacy uses that might be ambiguous now. (I haven't surveyed, I'm going on intuition.) But it *is* certainly the simplest, best-looking of the options otherwise.

Some responses from the late minutes that I couldn't get to during the call:

> fantasai: i think making this a unit feels wrong, if you want the boxes to match you should use box-sizing

That only works *sometimes*, if you can make sure that the box you're matching uses a specifiable border-box size. The example I was giving doesn't allow that - the *content* box is specifiable (100px), plus two hairline borders, and so the matching box needs to be 100px + two hairlines.

> fantasai: people might start using the unit to reference device pixels in a way that's more fragile than we want

I don't see how any of the options are more or less likely to do this. In *all* of them, you can reference device pixels in some way. `border-round(.1px)` is exactly the same as `1hairline`, just slightly longer to spell, and gives exactly the same abilities.

A *very limited* solution that just allowed the keyword `hairline` (and *not* as a calc keyword, only usable by itself, kinda like an intrinsic size keyword) would indeed make it harder to misuse, but only by making it harder to use *in general*. And it wouldn't rule it out anyway; you could use multiple elements to achieve the same effects in many situations.

-- 
GitHub Notification of comment by tabatkins
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3720#issuecomment-2864297026 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 8 May 2025 20:58:53 UTC