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

I guess my question is, how do we ensure predictable layout if we don't define the space taken up by a hairline border? Suppose we don't do that, and an author using a 2dppx display writes:

```css
.container {
  width: 500px;
}
.tile {
  display: inline-block;
  width: 99px;
  height: 99px;
  border: hairline solid black;
}

<div class="container">
  <div class="tile"></div>
  <div class="tile"></div>
  <div class="tile"></div>
  <div class="tile"></div>
  <div class="tile"></div>
</div>
```

On their 2dppx display, the border-box width of each tile is 100px, and the five tiles fit exactly within the container. But for a user on a 1dppx display, the border-box width of each tile is 101px, and the last tile wraps to a new line, thus breaking the intended layout. That seems worse to me than having small transparent gaps between the tiles on a high-res display.

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


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

Received on Saturday, 21 September 2024 17:17:45 UTC