W3C home > Mailing lists > Public > public-css-archive@w3.org > March 2017

[csswg-drafts] [flex] Sizing images with intrisic aspect-ratio: ¿harmonize with grids?

From: François REMY via GitHub <sysbot+gh@w3.org>
Date: Thu, 16 Mar 2017 19:18:13 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-214811013-1489691892-sysbot+gh@w3.org>
FremyCompany has just created a new issue for https://github.com/w3c/csswg-drafts:

== [flex] Sizing images with intrisic aspect-ratio: ¿harmonize with grids? ==
In https://github.com/w3c/csswg-drafts/issues/523#issuecomment-282771617, @mrego mentioned that the change we proposed to Grid to enable images to shrink while maintaining their aspect ratio, but no to fill maintaining their aspect ratio created a potential difference between flex and grid.

Since I had absolutely no idea what flex was doing in that case, I wrote a few test cases and -- surprise! -- we are not interoperable :) The good news is that this means maybe we can try to match what we do in grid, but the bad news is that this means some of us have bugs to fix...

Here are the two test cases:

- [Flex with definite size whose size is smaller than the image it contains (stretch-as-in-shrink)
](https://jsfiddle.net/zcqst2pr/)
![image](https://cloud.githubusercontent.com/assets/364405/24014172/2857bc94-0a41-11e7-8286-2fee87259d45.png)

- [Flex with definite size whose size is bigger than the image it contains (stretch-as-in-grow)
](https://jsfiddle.net/zcqst2pr/ )
![image](https://cloud.githubusercontent.com/assets/364405/24014188/3594de1e-0a41-11e7-9d3f-13fd5f97fdea.png)

I had a quick discussion with @fantasai and she seemed to believe Edge is behaving the per-spec in this case. It would be a good idea to think about what we are doing here and maybe try to match this behavior in grid for the /normal/ alignment as much as it makes sense. 

Now that we have both "stretch" to force-stretch and "width:contain" to force-fit, I think it would make sense to try to get the default behaviors of grid and flex match where possible. 

The difference is that grids do not have a preferred axis like flex does, but maybe we could change grid to behave as-if in these cases (the preferred axis being deduced from the writing mode)? Or is there a way to make flexbox functioning more like what we said to do for grids in another way that would make more sense?

Thoughts?

cc @gregwhitworth @tabatkins @dbaron 


Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1112 using your GitHub account
Received on Thursday, 16 March 2017 19:18:20 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 19 October 2021 01:30:30 UTC