Skip to content
Search Create account

DEV Community

DEV Community is a community of 870,143 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Twitter Facebook Github Instagram Twitch

Discussion on: Why we need CSS subgrid

View post
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 • • Edited on

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!