So I think this is a question solved by subgrid, should it be implemented, and I don't think display: contents can fix this (but I'd be interested in anyone else can think of a method).

As a demo I created a very simplistic fork of your pen using display: contents on the section and on .content so that the child elements of .content can use a grid defined on main.

http://codepen.io/rachelandrew/pen/XpbVpd?editors=1100#0

Needs Firefox as requires display: contents support

This does then enable the child elements of .contents to line up. However to do this I've had to fix the grid to a set number of columns and then place the items onto that grid. I did have a fiddle about with doing this with grid-auto-flow: column to see if I could get the items to auto-flow but then you get additional columns and not additional rows.

Once we are using display: contents each of those child elements becomes a grid item, with auto-flow: row we end up with them placing each in a grid cell by row as you can see here where I have removed the positioning: http://codepen.io/rachelandrew/pen/ggpoKZ?editors=1100#0

You'd also need to come up with an alternate approach for the background colours etc. on items as we lose those once the boxes are not generated due to display: contents.

I think in this case the revised subgrid specification would work as you know how many rows you need for your box contents. So you could place the parent boxes with regular auto-placement and declare their internal use of grid to be display: subgrid, rather than using display:grid and then use those row lines to layout the internals.

Anyway, I think this is a pretty standard example of the sort of thing people will want to do, I'd love to see other thoughts and experiments on achieving the end result!

On the assumption that sub-grid would not be available, can you think of any enhancements we could apply using Javascript to get the desired effect? When trying to do this type of thing through a Flexbox implementation, we've been setting heights to certain elements but when you're trying to make that work on a fluid design, it can be a performance nightmare.

I watched the video on display:contents and while it does look like a clever means to work around the lack of 'subgrid', it definitely qualifies as a hack, in this context. We might as well be using tables for layout again, or floating everything and using clearfloats. All the things that grid should solve.

Subgrid is necessary to have elements which line up properly in different rows without sacrificing semantic markup which is definitely going to happen until subgrid becomes standard.

Taking a moment to be arrogant, this debate over subgrid seems like a lack of creative vision on the part of those expressing "concerns". Or perhaps some kind of sabotage. It's a feature that is obviously required for the spec to really be complete, from a developer and designer perspective. Any bugs in the implementation need to be ironed out and subgrid needs to be a thing. Sometimes there's only one right answer.

"Taking a moment to be arrogant, this debate over subgrid seems like a lack of creative vision on the part of those expressing "concerns". Or perhaps some kind of sabotage."

That is not the case. It's a complex feature that requires discussion so we get a proper and usable spec and implementations. The feature was discussed by a number of us at the most recent face to face meeting (the notes of which are a matter of public record, as is everything the WG does). Throwing accusations at the people who are trying to make the platform better is unhelpful at best.

Can you point me to the public record? I am interested in seeing the issue raised by those opposed to inclusion of subgrid.

Based on my experiments the past few days it seems like grid won't be of any real full-page use when it comes out. The "Responsive CSS Grid" code published at http://www.responsivegridsystem.com/ is simply more capable, even if the code it creates is a bloated nightmare. That's a shame really because Grid is very exciting, on the surface.

I can definitely see use for grid in small pieces of a larger non-grid based layout however. Centering content vertically for example. But lacking the ability to line up items on different parts of the page to an overall grid is a crippling problem.

No-one is opposed to it. People wish to discuss it and make sure it is fit for purpose as once things get into implementations we are pretty much stuck with them. Please do some research before flinging accusations around.

There is discussion linking to in person discussion here w3c/csswg-drafts#958

If you would like to know how CSS is actually developed I spoke at CSSConf.EU on that subject: https://www.youtube.com/watch?v=cYGOv2ToZjY

Thanks, I appreciate the link. I will definitely be reading that.

I apologize if I offended you. I guess I was letting show my frustration after 20 years of having to use clever hacks to make up for things that should have been spec (vertical centering, for example). When I first heard about grid I wasn't that excited but as I read more about the features it included it really seems revolutionary, but if it can't be used for full-page layouts in production environments then that's half the excitement gone.

I think you and I see eye to eye about the importance of subgrid, based on a blog post I read of yours. So I certainly did not mean to offend.

Thank you. I've been doing this for 20 years too. I choose to try and be part of the solution rather than throw stones from the sidelines. I am just a web developer, I don't work for a browser, I am not funded by anyone for the voluntary work I do on the web platform. I would encourage other people to get involved too, if they care about this stuff.

I would also disagree with you that it can't be used for full page layouts due to lack of subgrid. Not every (or even most) layouts require subgrid, I've helped many many people at this point with grid and we do see issues that need subgrid. However nowhere near every layout. Not close.

You're absolutely right I am exaggerating the issue..

My first thought was "Wow! With Grid I could do anything!!" but only to discover that I can't quite do anything without subgrid. Of course before Grid I couldn't do many of the things it makes possible or easier, so I'm just upset about unhatched chickens. :)

I don't understand what Level 1 or Level 2 means, is level 2 farther from release or closer to release? Is there an explanation somewhere that isn't a video? I appreciate your time by the way, feel free to not answer.

I think you should do some research yourself, in order that you can be better informed.