Chrome Version: 60.0.3088.3 (Official Build) dev (64-bit)
OS: Ubuntu 16.04
What steps will reproduce the problem?
(1) Load https://bug1362789.bmoattachments.org/attachment.cgi?id=8866580
What is the expected result?
Image should be a large square. (700px wide and tall)
What happens instead?
Image is stretched to be rectangular, destroying aspect ratio -- image is 700px wide but only 300px tall.
Please use labels and text to provide additional information.
The flexbox spec section 9.4 "Cross Size Determination" says the following about how to determine cross sizes (the height in this testcase):
# Determine the hypothetical cross size of each item
# by performing layout with the used main size
# and the available space
https://drafts.csswg.org/css-flexbox-1/#cross-sizing
Here, the "used main size" is the stretched size (700px), and "performing layout" (for an image with auto height) should involve stretching its height accordingly.
(If the flex container had a specified height, things would be a bit different because then the flex line & its auto-height items with "align-self:stretch" would size to fit that perhaps-smaller specified height. But in my testcase, the flex container does not have a specified height, so that's not what should happen.)
Comment 1 by dholb...@gmail.com
, May 10 2017