DEV Community

loading...

Discussion on: Why we need CSS subgrid

Collapse
dan503 profile image
Daniel Tonon

Based on Rachel's post, it looks like 2 dimensional Sub-Grids are coming to Grid level 2. 😁

smashingmagazine.com/2018/07/css-g...

.parent {
  display: grid;
  grid-template-colums: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
}
.child {
  display: grid;
  grid-column: 1 / 3;
  grid-row: 1 / 3;
  grid-template-rows: subgrid;
  grid-template-columns: subgrid;
}
Collapse
kenbellows profile image
Ken Bellows Author

You know, you're right, and the current Working Draft seems to support that as well:

A grid container that is itself a grid item can defer the definition of its rows and columns to its parent grid container, making it a subgrid.

I must be out of date. The last I had heard was from Rachel's article from April, where she said:

At the CSS Working Group meeting in Berlin we resolved that subgrids should be able to be single axis only, returning them to the original concept rather than the revised one mentioned in my 2016 post.

But there have been at least 3 versions of the Working Draft released since then, and maybe it's changed back again? If so, that would be incredible!

Collapse
kenbellows profile image
Ken Bellows Author

Turns out you're right! I apparently have been missing the words "able to be" in Rachel's quote above! I've updated the article accordingly. Thanks a zillion for pointing that out to me!