[sic1]

This looks great, and could be a great tool to help some front-end developers.

However, I must say, it's 2019, if you call yourself a front-end developer, and you do not know flexbox and grid - you are greatly missing out on an amazing radical change in how you think about and design your layouts. There really is no excuse for not knowing this stuff, especially with all the great resources out there to help you learn.

Flexbox Zombies basically changed my life. It taught me the possibilities, and now I know them by hand. https://mastery.games/p/flexbox-zombies

The same company has a paid game to learn about the grid (https://gridcritters.com/), but I came across the resources below and did not buy it.

Flexbox Froggy and Grid Garden are both free, not gated by an email signup, and very high quality. You and everyone on your team should do them, even if you think you know them well. It will help with reinforcement.

- https://flexboxfroggy.com/ - https://cssgridgarden.com/

I think Gimli is an amazing tool, and I might even buy it when it comes out. But please, do yourself and your team a favor - learn the tools by hand first. If you wrote a float at all this year, this post goes out to you.

[gimliapp]

I don't think learning something necessarily mean knowing lots of names/properties by heart. You should however have a good idea of what grid and flexbox can do for you and when to use them I think.

I personally have a hard time differentiating between properties such as justify-content / align-content / align-items / justify-items / justify-self and so on. To me those are just random words. Perhaps because English is not my first language, I don't know.

I really think it makes a huge difference to see a small icon describing what properties have been set and to see the difference by hover instead of just reading/editing raw CSS.

I've visited https://css-tricks.com/snippets/css/complete-guide-grid/ and https://css-tricks.com/snippets/css/a-guide-to-flexbox/ countless of times. Some of the stuff just does not seem to stick tbh, especially if you have been working on something not-CSS related for some time.

I'm sure some people just remembers everything, but i'm not one of them :)

[espresso_enigma]

Agree with all of this, except that float still has a place. when you want text to flow around an element, float is great. I'm so glad that we don't need it for layout anymore, and I'm sure that's probably what you meant.

[nicoburns]

Agreed, although these days I find more new developers who know flexbox, but not traditional layout method like inline-block and position:absolute. IMO it's key to know both.

[cjohansson]

Flexbox and grid might not be compatible with your customers browsers

[onion2k]

It's unlikely that's the case unless you're in a weird niche where people use ancient tech though. Both flexbox and grid have been available since IE10, albeit in a slightly different form prior to Edge.

I happily write flexbox layout code in particular that works everywhere without any changes necessary for old browsers.

[gitgud]

Grid isn't supported on some web view's in Elo Android devices we deploy to...

[Diti]

Polyfills probably are.