Enhancement: teach the use of grid-template-areas

[mh166]

Hi guys,

I just completed this nice tutorial about CSS grid. An I just love it! Really great work!

A little addition that would make it even more helpful, I think, should be grid-template-areas. Personally, I find them soo useful as they make layouting with certain areas more easy. Not only is it more easy to read, but you can use different grid-template-areas definitions for different screen resolutions. Still, all client elements can reference the same area name and be layed out according the currently active template area.

A nice quick overview can be found in this CSS-Tricks article. An amazing presentation about the practical use of CSS Grid (in general and also template areas in specific) is given by Morten Rand-Hendriksen, speaking about how CSS Grid Changes EVERYTHING.

[rayshan]

I second the love for this website, and this enhancement request. There are a lot of advanced grid use cases we can add, such as packing layouts with auto-placement, auto-flow, auto-fill and auto-fit. Perhaps we can use this issue to make a list of things to add.