New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 786986 link

Starred by 4 users

Issue metadata

Status: Duplicate
Merged: issue 784059
Owner: ----
Closed: Mar 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 2
Type: Bug



Sign in to add a comment

Grid layout doesn't calculate 'auto' and 'fr' for row height correctly if used in flex-box with grow: 1

Reported by david.eb...@unblu.com, Nov 20 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36

Steps to reproduce the problem:
1. Open: https://codepen.io/anon/pen/rYJzdR or open attached file
2. See the height used by the 'auto' and '*fr' rows.

What is the expected behavior?
The 2 rows that have *fr set should grow, the rows using auto should not grow.

What went wrong?
The 2 rows that have *fr set should grow, the rows using auto should not grow. 
However the rows that have 'auto' set are the ones growing.

Firefox (v57) renders the result correctly.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 62.0.3202.94  Channel: stable
OS Version: OS X 10.12.6
Flash Version:
 
chrome-grid-grow-bug.html
1.1 KB View Download

Comment 1 Deleted

Labels: Needs-Triage-M62
Cc: jfernandez@chromium.org
Components: -Blink>Layout Blink>Layout>Grid
Labels: Triaged-ET M-64
Status: Untriaged (was: Unconfirmed)
Able to reproduce the issue on the reported version 62.0.3202.94 (please find atatched screenshot 786986_62.0.3202.94 for your reference)

Showing different behavior on latest build 64.0.3274.0 and 50.0.2641.0 which does not match excepted behavior (please find attached screenshot 786986_64.0.3274.0 and 786986_50.0.2641.0 for your reference)
Hence making it as non-regression 
++Adding screenshot
786986_62.0.3202.94.png
637 KB View Download
786986_50.0.2641.0.png
270 KB View Download
786986_64.0.3274.0.png
563 KB View Download

Comment 6 by e...@chromium.org, Nov 30 2017

Status: Available (was: Untriaged)

Comment 7 by onaim...@gmail.com, Mar 12 2018

I ran into this issue on my own project. User agent string: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.146 Safari/537.36

I don't know how valuable this is, but while investigating, I found out that setting flex-direction to "row" (even in the original CodePen) will work around this issue, so I believe this is only a problem with flex-direction: column.

Comment 8 by r...@igalia.com, Mar 14 2018

Cc: svil...@igalia.com r...@igalia.com
Mergedinto: 784059
Status: Duplicate (was: Available)
The problem is that a bug in flexbox (see  issue #784059 ) makes grid layout
to consider that the height is indefinite and not definite.

As a workaround you can add "flex-basis: 0" and it'll work.

Another option could be to replace "flex-grow: 1" by "flex: 1".

Sign in to add a comment