Re: [csswg-drafts] [css-contain-3] "container width" and "container height" units (#5888)

Just to flesh that out into the six value we need: 

- `qw`: 1/100th of the container `width`
- `qh`:  1/100th of the container `height`
- `qi`:  1/100th of the container `inline-size`
- `qb`:  1/100th of the container `block-size`
- `qmin`:  the smaller of `qb` and `qh`
- `qmax`:  the larger of `qb` and `qh`

(the only potential confusion here might be with the [`Q` unit](https://drafts.csswg.org/css-values-4/#Q)?)

In each case, the value can only be resolved inside a container of the appropriate [type](https://drafts.csswg.org/css-contain-3/#container-type). As an initial draft, I'm proposing that unresolved container-units default to zero. Any other fallback seems dangerous and unpredictable. Zero may seem dangerous, but I think it can work well in practice. Consider these uses, assuming there is no container:

```css
.examples {
  font-size: calc(1em + 0.2qmin); /* 1em */
  font-size: clamp(1em, 5qw, 3em); /* 1em */
  font-size: clamp(1em, max(5qw, 3vw), 3em); /* clamp(1em, 3vw, 3em) */
  padding: max(2qh, 1em) max(2qw, 1em); /* 1em 1em */
}
```

And, as mentioned by @andruud above, we can ensure they resolve by specifying them inside the appropriate @container queries. (I'll start with this as the draft spec, and we can revisit before publishing)

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


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

Received on Friday, 11 June 2021 20:25:33 UTC