Veerle Verbert: LEARN CSS DEEPLY

CSS is evolving. Rapidly. The block editor relies heavily on goodies that once seemed unfeasible to safely use crossbrowser: custom properties, flexbox, grid, … Recently CSS added extra powers that can already be used in real life and could take the block editor to the next level: aspect-ratio, calc(), min()/max()/clamp(), scroll-snap, …

But wait, there will be more game changing tools coming to every browser near you in a not-so-far future. Container queries? They’re happening. New viewport units? Subgrid? Color-contrast? :has()? Nesting? On their way.

Think about all the things that needed awful hacks to be achieved in a not so far away past (a padding hack, anyone?). Now start to imagine what will be possible natively with all the current and upcoming powers of CSS. And how the block editor needs those powers and will thrive on them. Can you?

In this talk we’ll explore some examples together. It is meant to be a practical sneak peak, but also aims to be an ode to CSS and an appeal for some extra CSS love within the Gutenberg project. Therefore an appeal to learn CSS deeply.