Closed Bug 1386921 Opened 7 years ago Closed 6 years ago

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


(Core :: Layout, defect, P3)

57 Branch



Tracking Status
firefox57 --- wontfix


(Reporter: me, Unassigned)


(Keywords: DevAdvocacy, Whiteboard: [devRel:P1])

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:

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.
Component: Untriaged → Layout
Product: Firefox → Core
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.
Keywords: DevAdvocacy
Whiteboard: [devRel:P1]
Priority: -- → P3
Ever confirmed: true
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
Closed: 6 years ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.