[css-grid][css-align] Align vs Grid vs undefined on how grid items are sized

[fantasai]

https://drafts.csswg.org/css-grid-1/#grid-item-sizing

A grid item is sized within the containing block defined by its grid area similarly to an equivalent block-level box in an equivalently-sized containing block, except that auto margins and the box alignment properties have special effects. (See §11 Alignment and Spacing.)

https://drafts.csswg.org/css-align/#valdef-justify-self-stretch

When the box’s computed width/height (as appropriate to the axis) is auto and neither of its margins (in the appropriate axis) are auto, the stretch keyword sets the box’s used size to the length necessary to make its outer size as close to filling the alignment container as possible while still respecting the constraints imposed by min-height/min-width/max-height/max-width.

CSS Align is missing a definition of how auto blocks are sized when the alignment is not stretch; specifically, it neglects to say they are fit-content sized (a difference from the normal behavior of blocks as specified in 2.1). Grid items, since they are sized like blocks, are likewise missing this definition.

Also, given normal for grid items is stretch, I'm unsure what was intended in the block axis. Blocks are normally content-sized, and the spec sortof implies they should behave like blocks; but the css-align spec defines grid items to exactly fit the track when stretched.

[fantasai]

Ok, I went over this issue with the Microsoft folks, and my conclusion is that we need to make sure grid items are sized the same (in both axes) as flex items are in the cross axis. This is for consistency with flexbox, whose behavior is much more grid-like in the cross axis (e.g. lines ~ tracks, items don't stack they stay in their own lines/tracks). This allows items to take the size of the tracks they're in, which is probably closer to author expectations (and Microsoft seems to have concluded this as well, since that's what their implementation does). Note that the spec currently applies the non-replaced block rules to grid items in the grid item sizing section quoted above; however since those rules are not consistent in both axes and we want grid to be consistent in both axes, we need to adjust one axis anyway.

Concretely, this means applying the CSS2.1 non-replaced block width formula to items when they are stretched, and fit-content sizing for other alignment values. I'll create edits to the spec as appropriate. Please let me know if you have any additional comments or considerations here.