New issue
Advanced search Search tips

Issue 619567 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Sep 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 2
Type: Bug

Blocking:
issue 79180



Sign in to add a comment

[css-grid] Regression handling inline overflow

Reported by a...@scirra.com, Jun 13 2016

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2766.0 Safari/537.36

Example URL:
https://dl.dropboxusercontent.com/u/15217362/bugs/cssgridoverflow/index.html

Steps to reproduce the problem:
Visit the given URL. This uses the following DOM layout:

1. A container div using display: grid and width: 400px
2. Within that, another div using display: grid, width: 100% and a three-column layout (100px 1fr 100px).
3. Enough text content in the middle column (1fr) to overflow.

What is the expected behavior?
The middle column should size to 200px and wrap the containing text, as shown here: https://dl.dropboxusercontent.com/u/15217362/bugs/cssgridoverflow/expected.png

Chrome 51 (stable) currently does this.

What went wrong?
The middle column overflows horizontally and never wraps, as shown here: https://dl.dropboxusercontent.com/u/15217362/bugs/cssgridoverflow/observed.png

Canary 53 currently does this, so it's a regression since 51.

Does it occur on multiple sites: Yes

Is it a problem with a plugin? No 

Did this work before? Yes 51.0.2704.84

Does this work in other browsers? Yes 

Chrome version: 53.0.2766.0  Channel: canary
OS Version: 10.0
Flash Version: Shockwave Flash 22.0 r0
 
Components: -Blink Blink>Layout>Grid
Cc: nyerramilli@chromium.org
Labels: Needs-Feedback
Thanks for the report.

Observing the same behavior in Canary 53.0.2766.1 (Official Build) & Stable 51.0.2704.84 on Win 7, using https://dl.dropboxusercontent.com/u/15217362/bugs/cssgridoverflow/index.html

attached screenshot for reference. Could you please check and let me know if I am missing something here.
619567_Win7.jpg
600 KB View Download

Comment 3 by r...@igalia.com, Jun 14 2016

Blocking: 79180
Cc: r...@igalia.com jfernan...@igalia.com svil...@igalia.com
Labels: -OS-Windows -Needs-Feedback OS-All
Status: Available (was: Unconfirmed)
Summary: [css-grid] Regression handling inline overflow (was: [CSS grid] Regression handling inline overflow)
@nyerramilli you need to enable the flag --enable-experimental-web-platform-features to test grid layout stuff.

@ash thanks for the report, it might be duplicated of  issue #578787  but I need to investigate it properly, anyway current result is clearly wrong.

Comment 4 by r...@igalia.com, Jun 14 2016

JFTR, it seems a different issue as the patch [1] I've for  bug #578787  doesn't fix this case.

[1] https://bugs.chromium.org/p/chromium/issues/detail?id=578787#c4

Comment 5 by a...@scirra.com, Sep 8 2016

Any news on this? Seems to make a lot of grid layouts kinda useless.

Comment 6 by r...@igalia.com, Sep 12 2016

Owner: svil...@igalia.com
Status: Assigned (was: Available)
@svillar has a patch for it that also fixes  bug #578787 .
Project Member

Comment 7 by bugdroid1@chromium.org, Sep 13 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/ac2a89c4ede377100fd06d965234420217875197

commit ac2a89c4ede377100fd06d965234420217875197
Author: svillar <svillar@igalia.com>
Date: Tue Sep 13 10:35:27 2016

[css-grid] Fix intrinsic size computation with flexible sized tracks

This is fixing a regression added in crrev.com/1317643005. When computing
the min content size of a grid container (min preferred logical width) we
should not take into account the fr tracks. As stated in the early versions
of the spec that size is the sum of the tracks' base sizes before running
the maximize tracks step.

That regression was causing sizing issues in grids with fr tracks both when
under min|max-content constrains and also when used as grid items (in nested
grids).

BUG= 578787 , 619567 

Review-Url: https://codereview.chromium.org/2337573003
Cr-Commit-Position: refs/heads/master@{#418212}

[modify] https://crrev.com/ac2a89c4ede377100fd06d965234420217875197/third_party/WebKit/LayoutTests/fast/css-grid-layout/flex-and-intrinsic-sizes-expected.txt
[modify] https://crrev.com/ac2a89c4ede377100fd06d965234420217875197/third_party/WebKit/LayoutTests/fast/css-grid-layout/flex-and-intrinsic-sizes.html
[modify] https://crrev.com/ac2a89c4ede377100fd06d965234420217875197/third_party/WebKit/Source/core/layout/LayoutGrid.cpp

Comment 8 by svil...@igalia.com, Sep 13 2016

Status: Fixed (was: Assigned)
So fixed :)

Sign in to add a comment