1386921 - [css-grid] firefox is distributing free space to empty row tracks when they are spanned

Status: RESOLVED WORKSFORME

(Core :: Layout, defect, P3)

Description

[Rachel Andrew]

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

Steps to reproduce:

I have a grid layout where I have some empty rows, occupied only due to an item with content spanning those rows, Firefox is distributing the height created by the spanning item to the empty tracks.

Test case: https://codepen.io/rachelandrew/pen/vJXJQr
Discussion: https://github.com/rachelandrew/gridbugs/issues/2


Actual results:

Firefox is increasing the size of grid tracks to distribute the space taken up by the spanned item.


Expected results:

The expected result is how this situation is handled in Chrome. Empty tracks should not be assigned extra space.

Comment 1

[Sergio Villar]

Adding some clarification just in case. The problem in the test example linked by Rachel is that Firefox is growing rows 1 and 2 over limits when it should not. After evaluating the item spanning 2 tracks the first two tracks should be [10,10] so the item spanning 3 tracks will force the third row to grow up to 60px to fill the min content contribution.

Firefox is apparently distributing the 60px among the 3 tracks (that's why tracks end up being 10+20 10+20 20) something that is not correct in this case as there is no need to grow the first two ones over the growth limits.

Comment 2

[Albert Scheiner [:alberts]]

Testing in FF 61 & 62 with CSS Grid dev tool Firefox distributes the space as Chrome in the example linked above now (10px 10px 60px). Closing as WFM