Intent to Ship: CSS Subgrid

703 views
Skip to first unread message

Ethan Jimenez

unread,
Jun 15, 2023, 1:49:13 AM6/15/23
to blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT), Ian Kilpatrick

Contact emails

eth...@microsoft.com

 

Explainer

None

 

Specification

https://www.w3.org/TR/css-grid-2/#subgrids

 

Design docs

 

https://docs.google.com/document/d/1cpsCmzdDlXUKtMxOUKIoJFyLH54mLVhZnam_z0PriO0/edit?usp=sharing

 

Summary

Implements the CSS Grid Layout Module Level 2 specification, which introduces the concept of a "subgrid" to nested grid containers.

 

Blink component

Blink>CSS

 

Search tags

subgrid, css-grid-2, css

 

TAG review

Review Request for CSS Subgrid · Issue #712 · w3ctag/design-reviews (github.com)

 

TAG review status

Issues addressed

 

Risks

 

Interoperability and Compatibility

This is a well-defined specification from the W3C, so we would be addressing some interoperability gaps instead of causing them.

 

Gecko: Shipped/Shipping

 

WebKit: Shipped/Shipping

 

Web developers: Strongly positive

 

Other signals:

 

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?

 

Debuggability

This feature is an extension of the capabilities of the CSS Grid Layout Module, no new properties will be introduced, but a new value "subgrid" will be introduced and properly rolled into the DevTools repository.

 

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?

Yes

 

Is this feature fully tested by web-platform-tests?

Yes

 

Flag name

LayoutNGSubgrid

 

Requires code in //chrome?

False

 

Tracking bug

https://crbug.com/618969

 

Estimated milestones

The below estimates may adjust depending on when fragmentation support and the fixes for a couple of invalidation bugs are completed.

 

Shipping on desktop

116

DevTrial on desktop

114

 

Shipping on Android

116

DevTrial on Android

114

 

Shipping on iOS

116

DevTrial on iOS

114

 

Anticipated spec changes

The below issues require spec resolution. These ones have interop risk depending on the resulting resolutions, but there is currently no interop between browsers on these today. As a result, we don’t consider these to block shipping, but we do plan to continue to drive forward resolutions:

 

The below issues require spec clarification, but there is already consensus between implementations and should not block shipping or result in any future risk:

 

Link to entry on the Chrome Platform Status

https://chromestatus.com/feature/5663795354533888

 

Links to previous Intent discussions

Intent to prototype: https://groups.google.com/a/chromium.org/d/msgid/blink-dev/MN2PR00MB06691936F5BB8575F43A9704BC569%40MN2PR00MB0669.namprd00.prod.outlook.com

 

This intent message was generated by Chrome Platform Status.

 

tkent via Chromestatus

unread,
Jun 15, 2023, 2:49:36 AM6/15/23
to blin...@chromium.org
LGTM1. Two other browsers already shipped the feature. No doubts about shipping it.

Yoav Weiss

unread,
Jun 15, 2023, 5:32:35 AM6/15/23
to Ethan Jimenez, blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT), Ian Kilpatrick
On Thu, Jun 15, 2023 at 7:49 AM 'Ethan Jimenez' via blink-dev <blin...@chromium.org> wrote:

Contact emails

eth...@microsoft.com

 

Explainer

None


Well, a short search revealed this article (by Ahmed Shadeed) as a great explainer!
https://wpt.fyi/results/css/css-grid/subgrid?label=experimental&label=master&aligned has a few red spots. Are those being tracked somewhere? Any sense of their impact on compatibility once we say we `@supports` subgrid?
 
--
You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CO2PR00MB02159FA23FB30A441DAC4B1FBC5BA%40CO2PR00MB0215.namprd00.prod.outlook.com.

Yoav Weiss

unread,
Jun 15, 2023, 5:36:08 AM6/15/23
to Ethan Jimenez, blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT), Ian Kilpatrick
Also, thank you so much for working on this and aligning us with other vendors on this important developer feature!! :)

Ian Kilpatrick

unread,
Jun 15, 2023, 12:04:42 PM6/15/23
to Yoav Weiss, Ethan Jimenez, blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT)
wpt.fyi is just a bit slow - all these tests are passing on ToT except "line-names-007.html" which is dependent on a CSSWG resolution from one of the issues listed below.

We've also asked that the additional tests which have been written be added to the interop 2023 effort here: https://github.com/web-platform-tests/interop/issues/361

Ian

Yoav Weiss

unread,
Jun 15, 2023, 12:10:39 PM6/15/23
to Ian Kilpatrick, Ethan Jimenez, blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT)
That's great to hear!!

Yoav Weiss

unread,
Jun 15, 2023, 5:22:59 PM6/15/23
to Ian Kilpatrick, Ethan Jimenez, blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT)
LGTM2

Manuel Rego Casasnovas

unread,
Jun 16, 2023, 7:14:16 AM6/16/23
to Yoav Weiss, Ian Kilpatrick, Ethan Jimenez, blin...@chromium.org, Alison Maher, Kurt Catti-Schmidt (SCHMIDT)
LGTM3

Really looking forward for having subgrid support everywhere!

On 15/06/2023 23:22, Yoav Weiss wrote:
> LGTM2
>
> On Thu, Jun 15, 2023 at 6:10 PM Yoav Weiss <yoav...@chromium.org
> <mailto:yoav...@chromium.org>> wrote:
>
>
>
> On Thu, Jun 15, 2023 at 6:04 PM Ian Kilpatrick
> <ikilp...@chromium.org <mailto:ikilp...@chromium.org>> wrote:
>
>
>
> On Thu, Jun 15, 2023 at 2:36 AM Yoav Weiss
> <yoav...@chromium.org <mailto:yoav...@chromium.org>> wrote:
>
> Also, thank you so much for working on this and aligning us
> with other vendors on this important developer feature!! :)
>
> On Thu, Jun 15, 2023 at 11:32 AM Yoav Weiss
> <yoav...@chromium.org <mailto:yoav...@chromium.org>> wrote:
>
>
>
> On Thu, Jun 15, 2023 at 7:49 AM 'Ethan Jimenez' via
> blink-dev <blin...@chromium.org
> <mailto:blin...@chromium.org>> wrote:
>
>
> Contact emails____
>
> eth...@microsoft.com <mailto:eth...@microsoft.com>____
>
> __ __
>
>
> Explainer____
>
> None
>
>
> Well, a short search revealed this article
> <https://ishadeed.com/article/learn-css-subgrid/> (by
> Ahmed Shadeed) as a great explainer!
>  
>
> ____
>
> __ __
>
>
> Specification____
>
> https://www.w3.org/TR/css-grid-2/#subgrids
> <https://www.w3.org/TR/css-grid-2/#subgrids>____
>
> __ __
>
>
> Design docs____
>
> __ __
>
> https://docs.google.com/document/d/1cpsCmzdDlXUKtMxOUKIoJFyLH54mLVhZnam_z0PriO0/edit?usp=sharing <https://docs.google.com/document/d/1cpsCmzdDlXUKtMxOUKIoJFyLH54mLVhZnam_z0PriO0/edit?usp=sharing>____
>
> __ __
>
>
> Summary____
>
> Implements the CSS Grid Layout Module Level 2
> specification, which introduces the concept of a
> "subgrid" to nested grid containers.____
>
> __ __
>
>
> Blink component____
>
> Blink>CSS
> <https://bugs.chromium.org/p/chromium/issues/list?q=component:Blink%3ECSS>____
>
> __ __
>
>
> Search tags____
>
> subgrid
> <https://chromestatus.com/features#tags:subgrid>,
> css-grid-2
> <https://chromestatus.com/features#tags:css-grid-2>,
> css <https://chromestatus.com/features#tags:css>____
>
> __ __
>
>
> TAG review____
>
> Review Request for CSS Subgrid · Issue #712 ·
> w3ctag/design-reviews (github.com)
> <https://github.com/w3ctag/design-reviews/issues/712>____
>
> __ __
>
>
> TAG review status____
>
> Issues addressed____
>
> __ __
>
>
> Risks____
>
> __ __
>
>
> Interoperability and Compatibility____
>
> This is a well-defined specification from the W3C,
> so we would be addressing some interoperability gaps
> instead of causing them.____
>
> __ __
>
> /Gecko/: Shipped/Shipping____
>
> __ __
>
> /WebKit/: Shipped/Shipping____
>
> __ __
>
> /Web developers/: Strongly positive____
>
> __ __
>
> /Other signals/:____
>
> __ __
>
>
> WebView application risks____
>
> /Does this intent deprecate or change behavior of
> existing APIs, such that it has potentially high
> risk for Android WebView-based applications?/____
>
> __ __
>
>
> Debuggability____
>
> This feature is an extension of the capabilities of
> the CSS Grid Layout Module, no new properties will
> be introduced, but a new value "subgrid" will be
> introduced and properly rolled into the DevTools
> repository.____
>
> __ __
>
>
> Will this feature be supported on all six
> Blink platforms (Windows, Mac, Linux, Chrome
> OS, Android, and Android WebView)?____
>
> Yes____
>
> __ __
>
>
> Is this feature fully tested by
> web-platform-tests
> <https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>?____
>
> Yes
>
>
> https://wpt.fyi/results/css/css-grid/subgrid?label=experimental&label=master&aligned <https://wpt.fyi/results/css/css-grid/subgrid?label=experimental&label=master&aligned> has a few red spots. Are those being tracked somewhere? Any sense of their impact on compatibility once we say we `@supports` subgrid?
>
>
> wpt.fyi is just a bit slow - all these tests are passing on ToT
> except "line-names-007.html" which is dependent on a CSSWG
> resolution from one of the issues listed below.
>
>
> That's great to hear!!
>  
>
>
> We've also asked that the additional tests which have been
> written be added to the interop 2023 effort
> here: https://github.com/web-platform-tests/interop/issues/361
> <https://github.com/web-platform-tests/interop/issues/361>
>
> Ian
>
>  
>
> ____
>
> __ __
>
>
> Flag name____
>
> LayoutNGSubgrid____
>
> __ __
>
>
> Requires code in //chrome?____
>
> False____
>
> __ __
>
>
> Tracking bug____
>
> https://crbug.com/618969 <https://crbug.com/618969>____
>
> __ __
>
>
> Estimated milestones
>
> The below estimates may adjust depending on
> when fragmentation support and the fixes for
> a couple of invalidation bugs are completed.____
>
> __ __
>
> Shipping on desktop____
>
>
>
> 116____
>
> DevTrial on desktop____
>
>
>
> 114____
>
> __ __
>
> Shipping on Android____
>
>
>
> 116____
>
> DevTrial on Android____
>
>
>
> 114____
>
> __ __
>
> Shipping on iOS____
>
>
>
> 116____
>
> DevTrial on iOS____
>
>
>
> 114____
>
> __ __
>
>
> Anticipated spec changes____
>
> The below issues require spec resolution. These ones
> have interop risk depending on the resulting
> resolutions, but there is currently no interop
> between browsers on these today. As a result, we
> don’t consider these to block shipping, but we do
> plan to continue to drive forward resolutions:____
>
> * [css-grid-1] Application of grid-positioning
> properties to static position of grid children
> is inconsistent · Issue #7661 · w3c/csswg-drafts
> (github.com)
> <https://github.com/w3c/csswg-drafts/issues/7661>____
> * [css-grid-2] Honoring the specified width/height
> of a subgrid · Issue #8966 · w3c/csswg-drafts
> (github.com)
> <https://github.com/w3c/csswg-drafts/issues/8966>____
>
> __ __
>
> The below issues require spec clarification, but
> there is already consensus between implementations
> and should not block shipping or result in any
> future risk:____
>
> * [css-grid-2] Clamp out-of-range subgrid items
> before or after auto placement? · Issue #8494 ·
> w3c/csswg-drafts (github.com)
> <https://github.com/w3c/csswg-drafts/issues/8494>____
> * [css-grid-2] How to properly accommodate
> margin/border/padding of a subgrid with no item
> on the edges · Issue #7465 · w3c/csswg-drafts
> (github.com)
> <https://github.com/w3c/csswg-drafts/issues/7465>____
>
> __ __
>
>
> Link to entry on the Chrome Platform Status____
>
> https://chromestatus.com/feature/5663795354533888
> <https://chromestatus.com/feature/5663795354533888>____
>
> __ __
>
>
> Links to previous Intent discussions____
>
> Intent to prototype:
> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/MN2PR00MB06691936F5BB8575F43A9704BC569%40MN2PR00MB0669.namprd00.prod.outlook.com <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/MN2PR00MB06691936F5BB8575F43A9704BC569%40MN2PR00MB0669.namprd00.prod.outlook.com>____
>
> __ __
>
> This intent message was generated by Chrome Platform
> Status <https://chromestatus.com/>.____
>
> __ __
>
> --
> You received this message because you are subscribed
> to the Google Groups "blink-dev" group.
> To unsubscribe from this group and stop receiving
> emails from it, send an email to
> blink-dev+...@chromium.org
> <mailto:blink-dev+...@chromium.org>.
> To view this discussion on the web visit
> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CO2PR00MB02159FA23FB30A441DAC4B1FBC5BA%40CO2PR00MB0215.namprd00.prod.outlook.com <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CO2PR00MB02159FA23FB30A441DAC4B1FBC5BA%40CO2PR00MB0215.namprd00.prod.outlook.com?utm_medium=email&utm_source=footer>.
>
> --
> You received this message because you are subscribed to the Google
> Groups "blink-dev" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to blink-dev+...@chromium.org
> <mailto:blink-dev+...@chromium.org>.
> To view this discussion on the web visit
> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAL5BFfUm7GpHioPc34QZ7XuKSrC%3DutGDUz0GOphL6S8d5e7r-A%40mail.gmail.com <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAL5BFfUm7GpHioPc34QZ7XuKSrC%3DutGDUz0GOphL6S8d5e7r-A%40mail.gmail.com?utm_medium=email&utm_source=footer>.
Reply all
Reply to author
Forward
0 new messages