Thanks to visit codestin.com
Credit goes to github.com

Skip to content

[css-grid] Sizing algorithm should work for span > 2 #3617

@Loirooriol

Description

@Loirooriol

https://drafts.csswg.org/css-grid/#algo-spanning-items has an algorithm for items with a span of 2. Items with a span of 1 are handled beforehand. Items with a span greater than 2 are not explicitly handled anywhere. Why?

I tried this example: https://jsfiddle.net/qg5v0zLa/

The grid container has an explicit width of 200px. The columns are sized with min-content max-content, and extra ones with 0. The grid item has a min-content contribution of 50px and a max one of 100px.

If the grid item spans 2 columns, they become 25px 75px according to https://drafts.csswg.org/css-grid/#algo-spanning-items.

But if the item spans 3 columns, https://drafts.csswg.org/css-grid/#algo-grow-tracks should be reached with base sizes of 0 0 0 and growth limits of infinity infinity 0, so the columns should become 100px 100px 0.

This is not what Firefox and Chromium do, though. The columns end up being 25px 75px 0px, as expected.

So instead of "items with a span of 2" the spec should say "items with a span of at least 2"

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions