- From: Oriol Brufau via GitHub <sysbot+gh@w3.org>
- Date: Wed, 02 Jun 2021 20:35:55 +0000
- To: public-css-archive@w3.org
@jensimmons Note, though, that only works because the row has a fixed height. If you change `grid-template-rows: 50vh 50vh` into
```css
grid-template-rows: 1fr 1fr;
height: 100vh;
```
then the image will be too tall in latest Chromium. Because the 1st column will be `100vw - 600px`, then the image will be horizontally stretched to fill that space, and then the aspect-ratio will make the intrinsic row grow too much.
Sure, you have `height: 100%`, but when sizing the rows, the percentage is indefinite, so it behaves as `auto`.
A more general solution, as I posted in https://github.com/w3c/csswg-drafts/issues/6257#issuecomment-848941703, is
```css
img {
width: 0;
height: 0;
min-width: 100%;
min-height: 100%;
}
```
This way the intrinsic contribution is 0, but when sizing for real, it will fill the desired space.
--
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6257#issuecomment-853365475 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Wednesday, 2 June 2021 20:36:15 UTC