Re: [csswg-drafts] [css-grid-2] Masonry layout (#4650)

@argyleink argyleink
> Notice how not 1 demo has a shared row line anywhere. I believe this to be the defining feature of masonry and I believe it conflicts with putting masonry into css grid.

The proposal here is to define a "one-dimensional grid", so that you have tracks in just one axis and a continuous flow (stacking blocks one after another) in the other. So indeed, there are no "shared row lines" anywhere in the masonry axis (except at the start edge perhaps). It seems to me this is precisely what masonry layout is about, one axis has grid-like properties (tracks), while the other axis has a continuous flow (in each track separately).

I considered using flexbox instead, but I came to the conclusion that Grid is the ideal fit since all the complicated stuff is in the grid-axis and we get that for free with Grid. The layout in the masonry axis is trivial in comparison. As I see it, re-using well-known concepts from Grid is a benefit to everyone: spec authors can re-use large parts of the Grid (and Box Alignment) specs (blockification of items, item placement/spans, grid lines, track sizing, content/self-alignment etc (in the grid-axis)); implementors can cheaply implement this by re-using large parts of their CSS Grid implementation; and authors can re-use their existing knowledge about grid layout and their CSS properties.

@meyerweb using `display: grid` and specifying `masonry` for each axis separately (akin to `subgrid`) is just a convenient way to re-use existing properties/values. I don't feel strongly about what specific syntax we use though, except that the grid-axis should use existing Grid properties/values.

-- 
GitHub Notification of comment by MatsPalmgren
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4650#issuecomment-577284001 using your GitHub account

Received on Wednesday, 22 January 2020 16:59:59 UTC