CSS Grid is the most exciting layout feature which became part of our available CSS toolset since Flexbox. It allows us to get rid of the hacks and workarounds we used to use in the past. It brings simplicity to declaring layouts. And while I mentioned it with Flexbox you do not have to choose one or the other! You can use them together (if you want).

CSS Grid gives us powerful new abilities: it is bidirectional so the layout can be aware of both horizontal and vertical space at the same time. It also lets adapt to the available space without the need for media queries.

And how about CSS Custom Properties? I'm sure that you are familiar with variables in CSS preprocessors eg. in Sass. Custom Properties are a similar but more dynamic thing available directly in CSS. And they can be used in any preprocessor too if it is needed. And you can reuse preprocessor variables in the native ones.

And… and if you are interested, you may want to come to this presentation… I will introduce you the new syntaxes, I will show you some basic and some little bit more complex examples which you can adapt to your own tasks. I'll show you too how to use these new things without worrying if they will work in the targeted browser.

This session will be based on my DrupalCon Vienna 2017 session.