This is a page from theCascading Style Sheets Working Group Blog.Some other places to find information are the“current work” page,thewww-style mailing list, theFuture of CSS syndicator, and theissue list onGithub.

Do you want to know how theCSS WG works?Fantasaihas writtenabout:csswg, An Inside View of the CSS Working Group atW3C.

First Public Working Draft of CSS Grid Level 3 / Masonry Layout

The CSS Working Group has published a First Public Working Draft ofCSS Grid Layout Module Level 3 aka CSS Masonry Layout. This draft represents masonry layout as a built-in capability of CSS in two possible syntactic forms: a grid-integrated syntax, and a grid-independent syntax, both of which areoutlined as alternatives. We hope publication of this draft facilitates discussion about their relative merits.

The CSSWG has resolved to adopt fully mixed track sizing for this layout model, allowing all the possible track listingsexpressible in CSS Grid Layout for masonry layout as well. This unifies the two incoming proposals’ underlying layout models; and therefore both syntactic forms represent essentially equal capabilities for masonry layout (though there are some open issues about possible differences in their initial values). To address performance concerns with mixed track sizing, the draft outlines specific performance optimizations in the layout model and adopts some simplifying heuristics for e.g. subgrids.

We are grateful to the designers and developers who commentedin the issues with their use cases, diagrams, and demos, which informed the development of this module—and welcome additional input, suggestions, and use cases to help guide its further refinement. We expect development of this module to proceed rapidly from this point forward, since it builds on the existing foundation of the grid layout algorithms.

Please send feedback byfiling an issue in GitHub orcommenting on an existing one (such asthis one orthis one). Alternatively you can send mail to the (archived) public mailing listwww-style@w3.org with the spec code ([css-grid-3]) and your comment topic in the subject line; or email one of the editors and ask them to forward your comment.

« Previous articleNext article »

Site navigation

Contact:

Last updated 2024-09-24 07:42:19