New issue
Advanced search Search tips

Issue 818401 link

Starred by 2 users

Issue metadata

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



Sign in to add a comment

[css-grid] Wrong 'auto' track size for a grid item with a specified 'width:max-content'

Project Member Reported by mpalmg...@mozilla.com, Mar 3 2018

Issue description

Chrome Version: 65.0.3311.3 (Official Build) dev (64-bit)
OS: Linux

What steps will reproduce the problem?
(1) load the attached testcase
(2)
(3)

What is the expected result?
In the two tests labelled "max-content", the grid container's width and its computed 'grid-template-columns' value should be 40px, because that's the grid item's max-content size.

What happens instead?
The grid item overflows the grid container in the two tests labelled "max-content".

The relevant spec section:
https://drafts.csswg.org/css-grid/#algo-single-span-items
"For auto minimums:
If the track has an auto min track sizing function and the grid container is being sized under a min/max-content constraint, set the track’s base size to the maximum of its items’ min/max-content contributions, respectively.

Otherwise, set its base size to the maximum of its items’ min-size contributions. The min-size contribution of an item is the outer size that would result from assuming the item’s min-width or min-height value (whichever matches the relevant axis) as its specified size if its specified size (width or height, whichever matches the relevant axis) is auto, or else the item’s min-content contribution."

When sized under a min/max-content constraint, the base size is the item's min/max-content contributions, respectively.  The item has an explicit 'width' that is 'max-content', thus it's min-content contribution is 40px and its max-content contribution is also 40px.
Thus the column size is 40px which makes the container's width 40px in both cases, thus the intrinsic width of the container is 40px.

Under "no constraint", the 2nd paragraph applies, and the 'min-size contribution' is "the item’s min-content contribution" (since its 'width' is not 'auto').
Again, the result is 40px.

Fwiw, I think the latest Firefox Nightly has the correct layout.
https://nightly.mozilla.org/
 
Chrome-bug-max-content.html
1.7 KB View Download

Comment 1 by r...@igalia.com, Mar 6 2018

Cc: svil...@igalia.com jfernan...@igalia.com
Status: Available (was: Untriaged)
Thanks for the bug report.

I'm uploading a reduced test case.
bug-818401.html
219 bytes View Download
bug-818401.png
6.6 KB View Download

Sign in to add a comment