[css-grid-2] Clamp out-of-range subgrid items before or after auto placement?

[KurtCattiSchmidt]

https://www.w3.org/TR/css-grid-2/#subgrid-implicit

The spec states:

"The subgrid does not have any implicit grid tracks in the subgridded dimension(s). Hypothetical implicit grid lines are used to resolve placement as usual when the explicit grid does not have enough lines; however each grid item’s grid area is clamped to the subgrid’s explicit grid (using the same procedure as for clamping placement in an overly-large grid).
For example, if a span 1 subgrid has a grid item with grid-column: 2 / span 3;, then that item is instead forced into (and limited to) the first (only) track in the subgrid."

This doesn't indicate when to perform the clamping, and this can have implications on placement if it happens before or after the auto placement algorithm.

Modifying the example above slightly to demonstrate this:

If a column span 1 and row span 2 subgrid has a grid item with grid-column: 2 / span 3, then that item is instead forced into (and limited to) the first track in the subgrid. Now consider if it has a second item with grid-column: 2 / span 3.

If clamping occurs before the auto placement algorithm, both items will be clamped to the first row of the subgrid. Then, auto placement will consider the overlap, and the second item will be placed in the second row.

If clamping occurs after the auto placement algorithm, both items will be placed in hypothetical implicit lines during auto-placement and will not overlap during placement. However, once they're clamped (after auto placement), the implicit lines go beyond the subgrid span, so the first and second items will be placed in the first row of the subgrid (and will occupy the same space).

The intention of auto placement seems to be to avoid items occupying the same space, so it does make sense to perform clamping before auto placement (so that out-of-range items do not overlap). However, the spec is ambiguous here.

Note that Firefox and Safari's behavior is to clamp before auto placement. Chromium used to clamp after auto placement, until I changed it recently to fix a subcase of http://wpt.live/css/css-grid/subgrid/repeat-auto-fill-001.html. I also added a WPT test that hits this scenario (http://wpt.live/css/css-grid/subgrid/placement-implicit-001.html).

[bfgeek]

cc/ @fantasai @tabatkins

[tabatkins]

Per the original spec text about clamping in https://w3c.github.io/csswg-drafts/css-grid/#overlarge-grids, the answer is neither "before" nor "after" auto-placement, it's during auto-placement, as each element is placed. The first child is auto-placed, it exceeds the bounds of the grid, and it's clamped to fit. Then the second is placed.

We can't clamp entirely before the algo, as the placement algo might, itself, put elements outside the grid area.

[KurtCattiSchmidt]

That is definitely true, and what you described is exactly what my fix was!

However, https://w3c.github.io/csswg-drafts/css-grid/#overlarge-grids could also be interpreted as before, during, or after placement as well, don't you think?

[tabatkins]

The sentence I was trying to indicate was "If a grid item is placed outside this limit, its grid area must be clamped to within this limited grid.". This is meant to indicate clamping occurs as placement happens; it would be worded differently if it was intended to clamp all positions after all placement had happened, or if it intended for clamping to happen before placement (somehow).

I can try to word that more clearly, if you think it's necessary?

[KurtCattiSchmidt]

I think the ambiguity for me is the word "placed" in the above quote. If "placed" always refers to the auto-placement algorithm, then it's not ambiguous and must be clamped during placement as you described.

However, if "placed" is referring to the content author specifying an out-of-range index, I think it's still ambiguous. And the real heart of this question is when the out-of-range index should be clamped. In both scenarios (subgrids and going beyond a UA limit), there is a predetermined limit, so clamping could happen before, during, or after auto placement, and in the example above, the final placement result will differ based on when this occurs.

The spec seems to use "placement" as both auto placement and author-specified indices that go out of range:

https://w3c.github.io/csswg-drafts/css-grid/#overview-placement

"They can be explicitly placed using coordinates through the grid-placement properties or implicitly placed into empty areas using auto-placement."

https://w3c.github.io/csswg-drafts/css-grid/#placement

"allow the author to specify a grid item’s placement"