@kball If we go like this, there is no need to support things like KISS

And I don't think just to support Old IE, Going down 3% browser users and its hacks, we need to change our whole dev environment with things Like KISS and PostCSS... There is no need for that
There is brand new EDGE after all.

But consider, that display flex and display grid have very different behavior and are not substitutes. I'm not even sure if it's a good idea to wrap display: grid into css classes. Same as with flexbox many features "get lost" when wrapped into classes.

But consider, that display flex and display grid have very different behavior and are not substitutes.

I am not saying to use grid only for first support tag... we can and should use "Grid + Flex"
Also on not substitutes,
That is what Is called Progressive enhancement, No?
Show as much as possible for a fallback

See this example BTW => https://codepen.io/primalivet/pen/ryjKmV?editors=0100

EDIT: Just found out that Opera Mini also supports flexbox 😛 and its only UC browsers that don't support flexbox (old spec, doesn't support wrapping) fully so updated my thread

The thing that matter with layouts is that, CSS Grid is perfect for 2-directional layouts
But Flexbox can do some good stuff too, but with lot more work for 2-directional layouts

What we need is an answer to this question (choose one from two below)

1. I can do all the Crazy stuff & App Layouts, support everything even UC browser but IE?
2. I can't do much stuff, have lot of hacks, doesn't even support UC browser but hey I support IE?

Good article https://ihatetomatoes.net/message-for-grumpy-developers/

The Good: Things used to be much more simpler

The Bad: CSS layouts with float and clearfix felt like a hack

The Now: Create CSS layouts without any hacks

The Solution: Remove all distractions and learn from simple demos

The Future: I can’t wait to build more responsive and faster UI with the latest CSS specifications, instead of spending time coding workarounds for old browser imperfections.

Build 7 now with the future in mind. Let those that want and can use it help make it better for those that don't and can't just yet. 6 is for IE, 7 is for the future. If 7 does not look forward enough, before the time 8 is due people will be looking for alternatives that are not a backward 7. Let hop skip then jump into a future version 7.

And what is wrong with a great foundation 6 for those that need to support old tech and what is a 7 that includes them going to do to change their or our developments. Not much. It would only be a lot of effort for a 6.7.

@digitalfuel All the thing aka normal grid remains same ... we are not changing that

In General for 2D,
What we are thinking is to create Sass mixins for some cool stuff like
https://codepen.io/primalivet/pen/ryjKmV?editors=0100
2d will only support CSS Grid with Flexbox fallback

In 1D,
I think we can use CSS Grid with flexbox and inline block fallback (Progressive Enhancement )
If needed we can support IE too
See this => https://s.codepen.io/matuzo/debug/Emddvx

You can read about progressive enhancement in this article to know more => https://www.smashingmagazine.com/2017/07/enhancing-css-layout-floats-flexbox-grid/

I like this idea as it can be easily removes if deemed not needed for a specific project.

How is the CSS Grid looking to be implemented into the Framework. Will it be implemented into the current HTML structure like XY Grid or will it be independent from it?
Is there an example of the current thinking?

Boom right now we dont know but some experiments going on internally and things going well

Please, do not try to shoehorn CSS Grid Layout into Foundation's grid system.

https://rachelandrew.co.uk/archives/2017/07/01/you-do-not-need-a-css-grid-based-grid-system/

CSS Grid Layout is the framework. It needs no abstraction. Anything you do will make an already complex spec even more complicated and confusing.

Don't worry, nothing like that!

Our focus is Sass mixins (and functions for progressive fallback).

This:

@supports (display: grid) {
  .grid-x, .grid-y {
    /* CSS Grid */
    /* Both 1D and 2D */
    display: grid;  /* Latest Chrome, Firefox, Safari, Opera, Edge */
  }
}

And this:

Our focus is Sass mixins (and functions for progressive fallback).

would lead me to believe that you are trying to somehow co-opt CSS Grid Layout into an abstracted system.

You do not need to do this.

Any line of code you write will be an unnecessary abstraction and limitation of CSS Grid Layout. If you want to support "progressive enhancement," then leave CSS Grid Layout out of your codebase and only provide the fallback (no need to do this through @supports either, just make it an optional @import). You cannot provide a CSS Grid Layout framework because it is already a framework.

Cramming CSS Grid Layout into Foundation's grid system would be like cramming the Bootstrap grid system into Foundation--while somehow trying to support both--and then providing an extra layer of classes on top. It just doesn't make sense. The work is already done. Don't reinvent the wheel.

Cramming CSS Grid Layout into Foundation's grid system

We are certainly not doing that. I am sorry many things I can't tell because of being an early stage... but FWIW... it looks like that most probably, we are not touching XY Grid!

Another FWIW... we are just applying maths!

Glad to hear CSS Grid will not be stuffed into the grid system.

I would love to see an example of the apply math concept.
And would also like to know where all the talk of CSS specs in F7 ended up.

Something like
Code once, Run with different spec's !

@IamManchanda closing out this feature request to be reconsidered in v7.

It seems like that this is already labelled for v7 and we closed it by mistake so we are reopening it... Thanks!

As discussed with Yetinauts,

We can also use JS to detect IE 10 & 11
to make something like https://codepen.io/IamManchanda/pen/BJbzmR & much more to work just like

@mixin grid-code {
  // My Grid Code
}

@mixin flexbox-fallback {
  // My Flexbox Fallback
}

@supports (display: grid) {
  @include grid-code;
}

@supports not(display: grid) {
  @include flexbox-fallback;
}

html.ie-10-11 {
  @include flexbox-fallback;
}

V7 requests are being closed for the time being. We have them labeled so we can readdress them in the future.