The CSS Podcast

Too small? Too big? Learn how to make your images just right and all the reasons they might be looking a little funky when you're adding media to your interface.

Links:

CSS for Web Vitals → https://goo.gle/3E98gY9

Learn Responsive Images → https://goo.gle/45EFuds

Aspect Ratio → https://goo.gle/3PdyjDS

Demos → https://goo.gle/3qJuQ6z & https://goo.gle/45uDvZB

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs

In this episode we're overjoyed to overexplain why you may be having overflow in your page. somewhere over the rainbow, an overheating developer overcooked the inline sizes and ended up oversleeping for work the next day. Now let's overanalyze and overshare about CSS overflow.

Links:

The rules of Margin Collapse → https://goo.gle/441OGaH

Everything you need to know → https://goo.gle/4434Ctj

Check out → https://goo.gle/3YrJDiw

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers YouTube → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast

In this episode we explore why margin may not be working for you. We'll teach you about block formatting contexts and margin collapsing! We'll make you the space you want in your designs!

Links:

The Rules of Margin Collapse → https://goo.gle/441OGaH

CSS Margins → https://goo.gle/4434Ctj

Learn more → https://goo.gle/3YrJDiw

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers YouTube → https://goo.gle/ChromeDevs

In this episode we explore why z-index isn't working for you. We'll teach you about stacking context and how to make sure you've set yourself up for layering success! Join us on this journey through positioning, variable architecture, tools, and more, to bring those elements to light.

Links:

Stacking context → https://goo.gle/43It8jl

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers YouTube → https://goo.gle/ChromeDevs

Listen to Adam and Una recap all of the exciting landings they talked about in 2022 in this end-of-season recap. If you missed the others, don't miss this one!

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes on YouTube→ https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers YouTube → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast

In this episode Una and Adam talk about CSS Nesting, per the current 2022 spec draft. They'll cover the syntax basics, some gotchas and of course a bunch of examples.

Links

Nesting 1 Spec - https://goo.gle/3VgnoJR

Adam exploring the prototype implementation in Canary - https://goo.gle/3UGsMpv

@scope and @layer and nesting - https://goo.gle/3EyJ3Hq

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers YouTube → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast

In this episode Una and Adam discuss subgrid, a special value for grid-template-rows or grid-template-columns. Learn the general details of usage, use cases, tips, tricks and gotchas, so you can use the feature with confidence.

Links

CSS Grid Spec - https://goo.gle/3EfjoDq

MDN - https://goo.gle/3tbooTx

Smashing Magazine - https://goo.gle/3DUb7Ds

Ahmad Shadeed on Subgrid - https://goo.gle/3EeStaP

State of CSS (subgrid) - https://goo.gle/3fQDvP4

Full Bleed Subgrid demo - https://goo.gle/3TkZ1Jv

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers YouTube → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast

Media query range syntax is a really nice addition.

Links

• Polyfill: https://goo.gle/3TXcyYD
• New syntax for range media queries: https://goo.gle/3DQlHg0

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes on YT → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast

In this episode Una and Adam cover changes to the color level 5 and new color level 6 specs, so you can stay HD on the topic. Plus, a dive into CSS color functions for manipulating colors.

Links

CSS Color Module Level 5 → https://goo.gle/3f8BgpT

CSS Color Module Level 6 → https://goo.gle/3TIsPAI

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast

:has() is a new CSS selector which allows developers to query for the presence of a child or state. It has been called the "parent selector", but it's much more than that! Using :has() you can style up and down a DOM tree, making this an incredible powerful feature. Learn how to take advantage of this new API with lots of examples in this episode.

Links

• Blog → https://goo.gle/3CIs1EF
• Selectors → https://goo.gle/3EQsPde
• Pseudo-classes → https://goo.gle/3SgvH69
• Creative CSS Layout → https://goo.gle/3yRv4sZ
• Quantity Queries for CSS → https://goo.gle/3a4NPwT

Una Kravets (co-host)

Twitter | Instagram | YouTube

Making the web more colorful ✨🎨 Web DevRel @googlechrome Unicorn face host of @toolsday & Designing in the Browser 🎬

Adam Argyle (co-host)

Twitter | Instagram | YouTube

@GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘

Catch more episodes → https://goo.gle/CSSpodcast

Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs

The CSS Podcast

#CSSpodcast