Bug 202115 - [css-grid] Add support for subgrid (Grid Level 2)
Summary: [css-grid] Add support for subgrid (Grid Level 2)
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Other
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Matt Woodrow
URL:
Keywords: BrowserCompat, InRadar
Depends on: 236949 236958 236959 236054 236122 236148 236287 236336 236337 236338 236951 236953 236954 236955 236956 236957 245936
Blocks:
  Show dependency treegraph
 
Reported: 2019-09-23 11:27 PDT by Moritz Mahringer
Modified: 2023-05-16 20:06 PDT (History)
33 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Moritz Mahringer 2019-09-23 11:27:36 PDT
I'd like to suggest adding support for CSS Grid Layout Module Level 2 (https://www.w3.org/TR/css-grid-2/).

It has been implemented by Firefox/Gecko and ships in Firefox 69 (https://bugzilla.mozilla.org/show_bug.cgi?id=1496502).
Chromium seems to be working on it, albeit slowly / not prioritized (https://bugs.chromium.org/p/chromium/issues/detail?id=618969).

I think this will improve mobile and responsive data layouts significantly.
Comment 1 Miriam Suzanne 2019-10-22 13:35:18 PDT
Subgrid makes the grid layout specification much more useful across a wide range of use-cases. Without subgrid, authors resort to non-semantic markup, `display: contents`, and explicit sizing to get even a small fraction of what it can do. This can be the difference between spending minutes or days building a layout properly.

With support landing in Firefox 70 (Dec 3) it would be lovely to see compatibility in other browsers.
Comment 2 Radar WebKit Bug Importer 2020-01-24 10:13:36 PST
<rdar://problem/58871644>
Comment 3 Ole Strøm 2021-02-11 07:39:28 PST
It seems Chrome is making steady progress on their implementation.

After reading their issues on this, they're first focusing on landing their new grid implementation, and after that subgrid will be trivial to add.

That's nice. So I wondered what's the status on Safari, seeing that it would be the only blocker when Chrome gets it down (https://caniuse.com/css-subgrid).

Seems there's no mention of it on https://webkit.org/status/#?search=grid and no activity on this issue in over a year.

What's up? It would be awful if we have to wait to use subgrids until Safari supports it as well.


It would sadly not be the first time such a thing has happened.

While not exactly for this issue, it is a little related.

On my fairly regular projects the past year or two, where it would have been IE before, it's now Safari that's problematic and lagging behind.
I see more and more comments from developers feeling the same.

Causing us to have to compromise with workarounds or polyfills where possible.

Some examples:

https://caniuse.com/flexbox-gap
https://caniuse.com/input-datetime
https://caniuse.com/dialog
https://caniuse.com/css-scroll-behavior
https://caniuse.com/css-overscroll-behavior
https://caniuse.com/js-regexp-lookbehind

I do feel like the tide is turning. Almost all of the above are landing soon enough. I just hope we don't have to wait two years for this one as well.
Comment 4 Jen Simmons 2021-02-12 11:57:38 PST
Thanks for your comment, Ole. And for making a list of six other things you'd like to see implemented. We do hear you.
Comment 5 Ole Strøm 2021-04-22 08:49:58 PDT
My previous two projects used grids extensively. Some parts of them were tricky to implement correctly without subgrid, and, sadly, some were just not possible without too compromising workarounds.

Another friendly reminder that I'd looove to see this sooner than later.

Especially now that it seems more stuff and designs use grids! Seems IE11 ain't holding things back anymore 🎉
Comment 6 Daniel Hruška 2021-06-16 00:07:17 PDT
Subgrid lets us designers lay out content without thinking how to wrap everything into unnecessary containers. The HTML markup could be much cleaner and more maintainable.

Or you could simplify form layout in complex enterprise web apps aligning labels and inputs according one columns template.
Comment 7 firefoxic.dev 2021-10-22 23:50:46 PDT
Yesterday, the Chromium team started working on the Subgrid implementation.
https://bugs.chromium.org/p/chromium/issues/detail?id=618969#c58
What about this in WebKit? It would be great if Subgrid was implemented in both engines at the same time, as was the case with Grid itself.
Comment 9 Holger Jeromin 2022-03-25 04:33:17 PDT
JFYI: 
With https://bugs.webkit.org/show_bug.cgi?id=236821 subgrid was activated by default.
ref https://webkit.org/blog/12522/release-notes-for-safari-technology-preview-142/
Comment 10 firefoxic.dev 2022-04-07 00:21:08 PDT
This is a little strange. If the subgrid is already ready for release, then why aren't bugs 236949, 236958 and 236959 closed?
Comment 11 Holger Jeromin 2022-04-12 04:43:37 PDT
Perhaps a little buggy with some (few) websites is better then missing this feature altogether.