- From: Oriol Brufau via GitHub <sysbot+gh@w3.org>
- Date: Wed, 07 Sep 2022 21:08:30 +0000
- To: public-css-archive@w3.org
Covering all cases correctly seems tricky, e.g. the `.card picture` could have margins, it could be an inline-block centered with `text-align` or have surrounding content, etc. Too many edge cases where this will still look wrong.
But challenging the premise, I think the solution that you actually want is:
```css
.card {
border-radius: 24px;
overflow: clip;
overflow-clip-margin: content-box;
}
```
with `.card picture` and `.card footer` just having the default `border-radius: 0px`.
Demo: https://software.hixie.ch/utilities/js/live-dom-viewer/saved/10669 (works on Chromium)
--
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7707#issuecomment-1239884828 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Wednesday, 7 September 2022 21:08:31 UTC