Developing specifications for the CSS language
by Miriam Suzanne since
Miriam is an Invited Expert on the W3C CSS Working Group, helping to develop the next level of Cascading & Inheritance, in addition to other CSS standards.
Cascading Style Sheets (CSS) are the design language of the web – allowing authors and users to attach style (fonts, spacing, filter effects, style animations, and more) to structured documents and Web applications. By separating the presentation style from the content, CSS simplifies Web authoring and site maintenance.
Miriam is an editor on several specifications, and has lead the standardization of many popular CSS features since joining the group in 2020:
progress()
and related interpolation functions
for creating more dynamic and responsive CSS.All my research, explainers, and proposals are available at css.oddbird.net.
A huge thank you to the individuals and organizations sponsoring OddBird’s open source work!
We love contributing back to the languages & tools that developers rely on, from CSS & Sass to browser polyfills and Python. Help us keep that work sustainable and focused on developer needs!
Donate to our collectiveAnchor Positioning is available in all browsers. What’s next, with Eric Meyer.
on Winging It episode 26 with James & Miriam on | 60 min
It’s finally here! With the release of Firefox 145, CSS anchor positioning is available in all browsers. It’s still behind a flag in Firefox, so it isn’t Baseline Newly available quite yet. Join James Stuckey Weber, Miriam Suzanne, and Eric Meyer of Igalia as they talk about the emerging patterns...
A practical workshop on integrating modern CSS
by Miriam Suzanne
– New York
With special guest Roma Komarov
on Winging It episode 24 with Miriam & Stacy on | 59 min
The CSS Working Group got together in August to discuss a range of old and new issues. The following week, Miriam Suzanne and Stacy Kvernmo chatted with CSS expert Roma Komarov about how to create reusable and more flexible CSS using mixins and functions, what happened in the CSSWG meetings...
Is sass dead yet?
by Miriam Suzanne
– Amsterdam, NL
by Miriam Suzanne
– Cluj, Romania
– San Francisco, CA
A web development podcast from LogRocket
on PodRocket with Miriam Suzanne on
I talk with Noel Minchow about the philosophy and evolution of web design. We explore CSS origins, the cascade, accessibility, and how the balance between user control and brand expression defines the spirit of the web.
A workshop on resilient CSS layouts
by Miriam Suzanne
– Online
on For a Better Web with Miriam Suzanne on
I chat with Bruce Lawson about all things CSS. We geek out over the latest and greatest features like Cascade Layers, @Scope, Mixins, and Container Queries – exploring how these features impact web design.
The design of web design
by Miriam Suzanne
– online
– Victoria, BC
There are several proposals, but one major road block
by Miriam Suzanne on
We’re trying to make progress on shorthand syntax for CSS logical properties. But the path forward depends on where we hope to be a decade from now.
Can we get this process unstuck?
by Miriam Suzanne on
The CSS Working Group recently resolved to add a size shorthand for setting both the width and height of an element. Many people asked about using it to set the ‘logical’ inline-size and block-size properties instead. But ‘logical shorthands’ have been stalled in the working group for years. Can we...
on General Musings with Kevin Powell with Miriam Suzanne on
Kevin and I chat about getting involved with the development of the CSS language, from following along to opening issues, or even joining the CSS Working Group.
A workshop on resilient & maintainable CSS
by Miriam Suzanne
– Sydney, Australia
– Online
A deep-dive introduction to CSS container queries
by Miriam Suzanne
– Sydney, Australia
– Amsterdam, Netherlands
What makes something a ‘grid’, and what’s at stake?
by Miriam Suzanne on
Back in 2020, Firefox released a prototype for doing ‘masonry’ layout in CSS. Now all the browsers are eager to ship something, but there’s a hot debate about the best syntax to use.
CSS Working Group updates from July
by Miriam Suzanne on
Over the last month, the CSS Working Group has determined we can loosen containment restrictions for query containers, and agreed on a syntax for special-case support queries (like support for the gap property in a flex context, or support for align-content in a block flow context).
What I’ve been working on as an Invited Expert
by Miriam Suzanne on
The CSS Working Group has regular face-to-face meetings (hybrid online/in-person) throughout the year, and they always result in a flurry of activity! Here’s a rundown of some highlights from the last few months, with a focus on the features I maintain.
on Smashing Hour with Miriam Suzanne on
I joined Geoff Graham for a Smashing live stream to talk about CSS, web standards, music, and more!
Take your time with new CSS, but don’t sleep on the essentials
by Miriam Suzanne on
Several people have asked recently why container queries aren’t being used more broadly in production. But I think we underestimate the level of legacy browser support that most companies require to re-write a code-base.
on Work Item Podcast with Miriam Suzanne on
I joined Den Delimarsky on the Work Item podcast to talk about my path as a developer – from building a website for my theater company, to building a career and a company around it. In this show, we talk about the power of the web, and how CSS is...
Rethinking the CSS mixin proposal after CSS Day
by Miriam Suzanne on
The CSS Working Group has agreed to move forward with CSS-native mixins. But some recent mixin-like CSS tricks have an advantage that the official proposal doesn’t account for: they make it easy to remove a mixin after it’s already been mixed in.
on Mechanical Ink with Miriam Suzanne on
In this episode of the Mechanical Ink podcast, host Schalk Neethling sits down with Miriam Suzanne, a multifaceted expert in web development, an invited expert to the CSS Working Group, and a founder of OddBird.
on Shop Talk Show with Miriam Suzanne on
I drop by the show to talk about CSS updates and news on container queries, rolling out cascade layers, !important things to remember, custom properties, exit animations, CSS functions, state queries, and more.
on Learn With Jason with Miriam Suzanne on
CSS Container Queries promise even more powerful styling approaches, but... what the heck are they? How do they actually work? Miriam joined Jason to teach and explore Container Queries in live code.
A web development podcast from LogRocket
on PodRocket with Miriam Suzanne on
I talk with Noel Minchow about CSS Container Queries, why they took so long, how they work, and what to watch out for.
The complexities of containment, overflow, and ‘propagation’
by Miriam Suzanne on
I spoke about Container Queries at both Smashing Conference (San Francisco) and CSS Day (Amsterdam) – where I recommended setting up a root container to replace most media queries. Since then, Temani Afif pointed out a few issues with that approach, and sent me down a rabbit hole of overlapping...
With Cascade Layers & Container Queries
by Miriam Suzanne
– Victoria, BC
– San Francisco, CA
by Miriam Suzanne
– San Francisco, CA (hybrid)
– Vancouver, Canada
Size queries are stable, and shipping in browsers
by Miriam Suzanne on
Since we got a first look at a Container Queries prototype back in April 2021, the syntax has changed a few times. But now the spec is stable, browsers are getting ready to ship, and it’s time to make sure you’re using the same syntax they are!
A web development podcast from LogRocket
on PodRocket with Miriam Suzanne on
I talk with Noel Minchow about how to style the intrinsic web, what that means, and how it’s compatible with responsive design.
Experimenting with the shared element transitions API
by Miriam Suzanne on
There’s a new web API proposal for transitioning shared-elements across pages. It’s great for making smooth page transitions, but what if we apply it to individual elements with changing styles on a single page?
by Sana Javed on
Cascade layers are an exciting new addition to the CSS specification. A newly released polyfill now provides even greater browser support for the feature.
This episode went a little off the rails...
on Word Wrap Show with Miriam Suzanne on
I talk with Claire and Steph about changes to the Container Query syntax, our feelings about web components, named CSS colors, how much we like eating cookies, and other wild tangents.
on Morten Rand-Hendriksen with Miriam Suzanne on
CSS is evolving rapidly and new features come online all the time. Join Morten & Miriam to talk about what CSS layers and scope are all about and how they will change how we work with and think about the cascade in the future.
Miriam Suzanne at CSS-Tricks on
Cascade layers are a new CSS feature
that allows us to define
explicit contained layers of specificity,
so that we have full control over
which styles take priority in a project
without relying on specificity hacks or !important.
This guide is intended to help you fully understand
what cascade layers are for,
how and why you might choose to use them,
the current levels of support,
and the syntax.
on Wix, Now What? with Miriam Suzanne on
Miriam talks to Now What? about why the internet looks the way it does, why designers and developers need to collaborate and how the future of the web must be built around inclusivity and respect.
on Front End Nerdery with Miriam Suzanne on
A podcast focusing on front end development but also covering a wide range of web development and design topics. We talked about CSS, Sass, and work being done in the W3C CSS Working Group.
Modernizing the cascade for responsive design systems
by Miriam Suzanne
– Online
– Online
on Igalia Chats with Miriam Suzanne on
Igalia’s Brian Kardell sits down to chat with Miriam and Rachel Andrew about who works on standards, and who pays for that work.
on Syntax.fm with Miriam Suzanne on
In this episode of Syntax, Scott and Wes talk with Miriam about all things CSS – container queries, layers, scoping, and more!
on Word Wrap Show with Miriam Suzanne on
I talk with Claire and Steph about my journey into webdev and onto the CSSWG, what I find frustrating about how others use CSS, and the three specs I’m working on.
Adding Container Query tests to CSS @support
by Miriam Suzanne on
Working on a new CSS feature like Container Queries, one of the most important considerations is to ensure a "migration path" – a way for developers to start integrating the new code, without breaking their sites on legacy browsers. That looks different depending on the feature, but can often include...
on The F-Word with Miriam Suzanne on
I chat with Bruce Lawson & Vadim Makeev about Sass & Susy, CSS Layers & compatibility, Container Queries, and the CSS Working Group.
on Smashing Magazine with Miriam Suzanne on
Starting a new season of the Smashing Podcast with a look at the future of CSS. What new specs will be landing in browsers soon? Drew McLellan talks to Miriam to find out.
Now is the time to begin experimenting with a long requested layout tool.
by David A. Herron on
The @container query, that elusive feature developers have been requesting
and proposing for years, has finally made its debut in a browser. Well, sort
of. Here we’ll explain what container queries are, how they work, and what
other features they might come with once fully supported in browsers.
Helping define the future of styles on the web
by Miriam Suzanne on
I’ve joined the CSS Working Group as a W3C Invited Expert to help to develop the next level of Cascading & Inheritance, in addition to other CSS standards. I’m also currently active in the CSS4 and Design Token Community Groups.
Get free cutting-edge demos in your inbox! Grid & layouts with Miriam Suzanne, anchor positioning with James Stuckey Weber, and more! Peruse archive