Skip to main content

Cascading Styles: A CSS Deep Dive

Miriam Suzanne
On the web
miriam.codes
On Twitter
@
Tickets
Get a ticket

Workshop includes:

  • 🍵 Tea, coffee, snacks and drinks during the whole day
  • 🥪 Lunch
  • 📒 Paper and pen/pencil

Full-day workshop • Wednesday, September 6, 2023.
A lot has changed in the nearly 30 years since CSS was first proposed, and new features are shipping at an unprecedented rate – cascade layers, container queries, the ':has()' selector, wide-gamut colors, subgrid, and so much more.

Meanwhile, we're still getting used to custom properties and basic grids! Taken one at a time, the list can feel overwhelming, but these features all fit together to form a highly systemic language based on a radical foundation: the cascade of styles.


Here’s What You Should Be Expecting:

  • Inspiring & Immersive

    A full day of teaching in a small group

  • Interactive & Practical

    Plenty of time for practice & feedback

  • Hands-on exercises

    With reviews by your teacher

  • Cooperate

    Learn from your teacher and other attendees

  • Dedicated Q&A time

    To ask all your questions

  • Digital Smashing Certificate

    A well-deserved reward for your work


It’s a great time to revisit everything you thought you knew about CSS. Join Miriam for a deep dive into what makes the language work, and how we can harness it’s power to develop resilient and delightful experiences that hold up across browsers, languages, and device interfaces.

We’ll cover the range of new developments that make modern web design possible, and put them in context of a powerful declarative cascade.

Together, we’ll explore:

Selectors & the Cascade

We’ll look at selectors, their specificity, nesting, and of course custom properties.

  • origins and importance
  • cascade layers
  • specificity and source-order
  • :is(), :where(), and :has()
  • nesting & scope
  • preference & support queries
  • custom properties
  • naming & organizing conventions
  • progressive enhancement

Layout & Typography

From modern CSS layout to functions, from aspect ratios to media & container queries.

  • display, flow, and context
  • writing modes
  • logical properties
  • flexbox, grid, and subgrid
  • comparison functions
  • aspect-ratios
  • scroll-snapping
  • media & container queries

CSS Colors

Lastly, new color spaces & formats, accent-color and much more!

  • accent-color
  • color-scheme
  • new color spaces & formats
  • gradient color spaces
  • color-mix()

What prerequisites skills do you need?

The workshop is intended for professional front-end developers with experience in HTML and CSS.

What hardware/software do you need?

Bring your own laptop, your favorite text editor, and any practical CSS issues you’re facing.

About Miriam Suzanne

Miriam is an artist, engineer, and open-web advocate. She’s a co-founder of OddBird, Invited Expert on the W3C CSS Working Group, and Sass core contributor who enjoys pushing the boundaries of web technology.

These days she’s working on specifications for Container Queries, Scope, and Cascade Layers in CSS; extending the Sass color module to support wide-gamut colors; and learning to crochet socks.

Time & Location

This full-day workshop will take place the day after SmashingConf. The workshop will be running from 9:30 AM to 5:30 PM on Wednesday, September 6.

Schedule for Wednesday, September 6

9:00 AM – Doors open, Registration
9:30 AM – Introduction & Kick-off
11:00 AM – Coffee Break
1:00 PM – Lunch
2:00 PM – Afternoon Session
3:30 PM – Coffee Break
5:30 PM – The End

Save 100 EUR when signing up for the conference and a workshop!

Register for this workshop →