Re: [csswg-drafts] [css-grid-3][masonry] Masonry Syntax Designer/Developer Feedback (#11060)

For me the New Masonry Layout is clearer and more convenient.

Read articles from the WebKit and Chrome teams, as well as several blog posts. Main arguments for Just Use Grid:

> The Just Use Grid option leans into the idea that CSS Grid is a major layout mechanism for web pages, and we should keep expanding it to be more and more powerful.

Source [Help us choose the final syntax for Masonry in CSS; Extensibility](https://webkit.org/blog/16026/css-masonry-syntax/)

The idea of using a single mechanism to create any layout is appealing.

At the same time if the Just Use Grid approach is implemented there would be many properties and values valid only for `grid` or only for `masonry`. Think avoid this kind of behavior would be good.

> Let’s be honest, a layout is a major part of a web page that makes it hard to apply progressive enhancement.

Source [Should masonry be part of CSS grid?; If the new syntax is supported now, how we should use it?](https://ishadeed.com/article/css-grid-masonry/#if-the-new-syntax-is-supported-now-how-we-should-use-it)

Article then provides examples showing that implementing progressive enhancement for the New Masonry Layout requires more styles and the use of `@supports`.

Over time support for `masonry` will appear in all browsers, the priority now is to create an optimal solution to avoid difficulties future work. Besides, most developers use build tools, so such progressive enhancement doesn't need to be written manually. It's enough to use `display: masonry;` and, when necessary, the PostCSS plugin will automatically generate the required styles, based on the browserslist.

> If we go with the new syntax, then changing a layout will require changing the whole layout module (grid, masonry, or flex). This is too much work.

Source [Should masonry be part of CSS grid?; Responsive design](https://ishadeed.com/article/css-grid-masonry/#responsive-design)

The potential convenience of changing a layout at breakpoints seems like a strong argument for Just Use Grid. However I haven't seen examples showing in practice that Just Use Grid is better in this case.

On this matter I agree with @astearns, in [[this comment](https://github.com/w3c/csswg-drafts/issues/11060#issuecomment-2450764376)](https://github.com/w3c/csswg-drafts/issues/11060#issuecomment-2450764376), a comparison of two style examples is shown, and for me changing a layout at breakpoints using the New Masonry Layout looks clearer.

At the same time overriding the direction in Just Use Grid is inconvenient, if I understand correctly:

```css
.just-use-grid {
  display: grid;
  grid-template-rows: masonry;
}

.just-use-gridy--modificator {
  grid-template-rows: unset;
  grid-template-columns: masonry;
}
```

```css
.masonry {
  display: masonry;
}

.masonry {
  masonry-direction: row;
}
```

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 12 November 2024 13:20:58 UTC