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

• From: Jen Simmons via GitHub <sysbot+gh@w3.org>
• Date: Wed, 06 Oct 2021 22:43:35 +0000
• To: public-css-archive@w3.org
• Message-ID: <issue_comment.created-937288859-1633560214-sysbot+gh@w3.org>

- 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 qw and qh
- qmax: the larger of qw and qh

```
.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 */
}
```

or

- cqw: 1/100th of the container width
- cqh: 1/100th of the container height
- cqi: 1/100th of the container inline-size
- cqb: 1/100th of the container block-size
- cqmin: the smaller of cqw and cqh
- cqmax: the larger of cqw and cqh

```
.examples {
  font-size: calc(1em + 0.2cqmin); /* 1em */
  font-size: clamp(1em, 5cqw, 3em); /* 1em */
  font-size: clamp(1em, max(5cqw, 3vw), 3em); /* clamp(1em, 3vw, 3em) */
  padding: max(2cqh, 1em) max(2cqw, 1em); /* 1em 1em */
}
```

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


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

Received on Wednesday, 6 October 2021 22:43:37 UTC