New issue
Advanced search Search tips
Starred by 3 users

Issue metadata

Status: Available
Owner: ----
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug

Sign in to add a comment

Issue 721123: Chrome doesn't preserve aspect ratio for flexed images in auto-height flex container

Reported by, May 10 2017 Project Member

Issue description

Chrome Version: 60.0.3088.3 (Official Build) dev (64-bit)
OS: Ubuntu 16.04

What steps will reproduce the problem?
(1) Load

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

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, May 10 2017

Edge 15 and Firefox 53 give "expected result".  So this is an interop issue.

Comment 2 by, May 11 2017

Status: Available (was: Untriaged)

Comment 3 by, May 11 2018

Project Member
Labels: Hotlist-Recharge-Cold
Status: Untriaged (was: Available)
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available.

For more details visit - Your friendly Sheriffbot

Comment 4 by, May 11 2018

Status: Available (was: Untriaged)

Comment 5 by, Jan 26

This is still an important issue as it affects the display of images in a flex layout. Will it be prioritised to be fixed any time soon?

Comment 6 by, Jan 27

Here's a test page. None of these images should break their aspect ratio, and yet many do in both Blink and Webkit.

Sign in to add a comment