Podcasts by The CSS Podcast
Cascading Style Sheets (CSS) is the web’s core styling language. For web developers, It’s one of the quickest technologies to get started with, but one of the hardest to master. Follow Una Kravets and Adam Argyle, Developer Advocates from Google, who gleefully breakdown complex aspects of CSS into digestible episodes covering everything from accessibility to z-index.
Further podcasts by Google
Podcast on the topic Technologie
All episodes
78: Season 4 wrap! from 2023-12-06T19:28:12
I can’t believe we’re already at the end of season 4! This season, we’ve been focusing on CSS gotchas and resolving these common CSS pitfalls. And alas, on our last episode of the seas...
Listen
77: Why isn't percentage working here? from 2023-11-28T18:15:27
In this episode, Una and Adam talk about percentage resolution for various properties like font-size, padding height and width. They break down and explain why percentages may not work...
Listen
76: Why isn't my element stuck where I wanted it to stick? from 2023-11-15T18:21:36
In this episode Una and Adam help you uncover moments where a sticky element isn't sticking. There are a couple of gotcha around implementing a sticky element and by the end of the sho...
Listen
75: Why isn't my custom property the value I expect? from 2023-10-27T17:14:06
In this episode, Una and Adam discuss common gotchas with custom properties, which often feel fully reactive during use, but their limits and implementation details can popup at unexpe...
Listen
74: How do I center a div? from 2023-10-11T17:30:29
In this episode we tackle one of the most asked questions of all CSS history.. how do I center this div? We'll cover multiple strategies that each have tradeoffs and super powers over ...
Listen
73: Why is my animation glitching? from 2023-09-21T20:35:21
On this episode of the #CSSpodcast, we’re diving into how to deal with glitchy animations in your code base!
Links:
MDN transform-style - Listen
72: Why does my gradient have muddy colors in the middle? from 2023-09-08T19:40:45
In this episode, we tackle the issues around getting undesirable gradient results. Sometimes it's you, sometimes it's the color space. We'll help you identify, assess and remedy muddy ...
Listen
71: Why do I have layout shift? from 2023-08-31T21:43:48
In this episode we're shifting the topic to layout shift, that moment where you watch the page adapt to something lazily loaded which has impacted the layout in some way where you see ...
Listen
70: Why is my image distorted? from 2023-08-25T17:50:12
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.
69: Why is it overflowing? from 2023-08-16T19:25:02
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 u...
Listen
68: Why isn't the margin applying? from 2023-08-09T17:42:44
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 desig...
Listen
67: Why isn't z-index working? from 2023-08-01T17:41:15
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 j...
Listen
66: Season 3 recap&what’s next! from 2022-11-22T18:05:44
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! Listen
65: Nesting from 2022-11-15T18:45:07
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 examp...
Listen
64: Subgrid from 2022-11-08T18:42:50
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...
Listen
63: Media query range syntax from 2022-11-02T01:24:56
Media query range syntax is a really nice addition.
Links
62: Color functions: An update from 2022-10-26T16:47:15
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 function...
Listen
59: Container queries from 2022-10-06T20:16:08
Container queries (also known as @container) are a new entrypoint for truly component-based responsive design. In this episode, Adam and Una will walk you through...
Listen
58: Cascade layers from 2022-09-20T17:48:59
In this episode Una and Adam cover Cascade Layers (aka @layer). It's a way for authors to control and orchestrate their own CSS layering which can help avoid spec...
Listen
57: DevTools Mini Series - Interaction from 2021-12-29T07:59:18
DevTools Mini Series continues, this time on interactions. Una Kravets and Adam Argyle are joined by Jecelyn Yeen to discuss interaction, and interaction inspecti...
Listen
56: DevTools Mini Series - Accessibility from 2021-12-22T07:57:10
DevTools Mini Series continues, this time on accessibility tooling. Una Kravets and Adam Argyle are joined by Jecelyn Yeen to discuss how DevTools can help you di...
Listen
55: DevTools Mini Series - Layout from 2021-12-15T08:00
DevTools Mini Series continues, this time on layout. Una Kravets and Adam Argyle are joined by Jecelyn Yeen to discuss an overview of how DevTools can help you cr...
Listen
54: DevTools Mini Series - Color from 2021-12-08T07:51:42
Welcome to the DevTools Mini Series for The CSS Podcast. On this episode, Una Kravets and Adam Argyle are joined by Jecelyn Yeen to discuss an overview of color a...
Listen
53: Season 2 wrap up from 2021-08-03T17:00:31
We’ve reached the end of season 2 of the CSS Podcast. In this closing episode, we recap every episode by sharing our favorite tips and learnings from the last few months!
Episodes r...
52: counters and @counter-style from 2021-07-27T16:58:56
Count on The CSS Podcast to cover counters. Una and Adam teach all the ways to create, reset, and update counters. Use them for lists, games and more!
... Listen
51: Styling SVG in CSS from 2021-07-20T16:50
CSS and SVG are very intertwined, and you can create a lot of unique effects by combining the two. This episode dives into a few CSS + SVG tips and tricks, includ...
Listen
50: inherit, initial, unset, and revert from 2021-07-13T17:07:54
This episode is about the very available CSS values inherit, initial, unset and revert. We'll help explain what they are, what they do and when to use them. Listen
49: Accessibility from 2021-07-06T17:26:49
Today we are breaking down accessibility related styling choices to ensure a better user experience for all of your users. These include focus visibility, keyboar...
Listen
48: Touch interaction from 2021-06-29T16:54:18
Today we touch on touch interaction. Covering CSS's ability to change a user's touch experience with properties like touch-action, scroll-behavior, user-select an...
Listen
47: :is(), :where(),&nesting from 2021-06-22T17:29:18
In this episode, Adam and Una explore some CSS syntactic sugar! They discuss the :is and :where functions, how they differ, and how they’re paving the way for nes...
Listen
46: Custom properties from 2021-06-15T17:19:25
Custom properties, aka CSS variables, are runtime dynamic variables which allow you to store loose or typed values. They're free, super fast, improve code legibil...
Listen
45: Scroll timeline from 2021-06-08T16:48:04
In this episode we deep dive the experimental Scroll Animations spec to bring you the breakdown on @scroll-timeline powered CSS animation. Learn about scroll-link...
Listen
44: Transitions from 2021-06-01T17:09:53
In this episode it's all about transitions. What you can and can't transition, it's limits, and it's super powers. We'll finish up with ways to trigger transition...
Listen
43: Containment from 2021-05-26T16:50:08
The CSS contain property can give you some serious performance gains by adjusting how and when the browser renders elements. In this episode, we go over all the d...
Listen
42: Snap points from 2021-05-11T18:27:59
In this episode we're guiding scroll areas into their peaceful resting places, maintaining alignment, keeping visual harmony, and improving the overall experience...
Listen
042: Snap Points from 2021-05-11T18:27:59
In this episode we're guiding scroll areas into their peaceful resting places, maintaining alignment, keeping visual harmony, and improving the overall experience with the content.
Links:<...
41: Transforms from 2021-05-04T16:56
In this episode we enter the 3rd dimension with CSS, placing and manipulating objects in 3D space with the transform property. 2D and 3D transforms are spectacula...
Listen
40: @font-face from 2021-04-27T17:00
In this episode Una and Adam talk about font adjustments when being used within @font-face. When fonts are loaded, there's an opportunity to provide default values and fine tunings.
39: Paths, shapes, clipping and masking from 2021-04-20T16:42:28
Paths, shapes, clipping, masking, oh my! There’s so much you can do with CSS shapes—from creating transition effects to creating interesting and organic typograph...
Listen
038: The CSS Podcast: N-match Notation from 2021-04-13T20:20:42
Welcome back to The CSS Podcast, where we cover all things CSS from accessibility to c-index. Today, Una and Adam will discuss a micro syntax for pseudo class notification when working with nth-chi...
Listen
38: N-match Notation from 2021-04-13T18:20:42
Welcome back to The CSS Podcast, where we cover all things CSS from accessibility to c-index. Today, Una and Adam will discuss a micro syntax for pseudo class not...
Listen
37: Cursors and Pointers from 2021-04-06T17:00
What do mouse pointers, potatoes, and your fingers have in common? They can all interact with a screen! With CSS we can define how active our web boxes are, which areas are interactive, and what...
Listen
36: Text and Typography from 2021-03-30T17:00
In this episode we cover typography on the web from your CSS. From font properties to word breaking. Also, Adam gets thrown off and amazed at how dynamic the text...
Listen
35: Background from 2021-03-23T17:00
In this episode we cover all the ways to style an element's background: using images, colors, gradients and more.
Links Listen
34: Overflow from 2021-03-16T17:00
In today's episode we cover overscroll and all the ways to handle content that's bursting at the seams. The web has a natural tendency to show overflowing content...
Listen
33: Preference Media from 2021-03-11T18:00
In this episode we narrow our focus on user-preference-based media queries, which enable you to create personalized experiences based on your users custom setting...
Listen
32: Page Media from 2021-03-02T18:00
In this episode we talk about page media queries and all the ways you can pivot your styles based on device capabilities, viewport size, etc.
... Listen
31: @rules from 2021-02-23T18:00
In this episode we talk about CSS @rules and all the different customizations you can make to fonts, encoding, animations, Houdini, and more.
29: Houdini Series: Layout from 2020-12-09T18:00
In this episode, we get a little more experimental as we continue the Houdini series and discuss the Layout Worklet, also sometimes referred to as the Houdini Lay...
Listen
28: Houdini Series: Paint from 2020-12-02T18:00
In this episode, we continue the Houdini series and enter worklet land! We go over the Paint Worklet, an API that enables developers to define canvas-like custom ...
Listen
27: Houdini Series: Typed OM from 2020-11-18T18:00
In this episode we go over the TypedOM, a new API for parsing, converting, creating and managing CSS. It's typed, as the name suggests, and these typings not only...
Listen
26: Houdini Series: Properties&Values from 2020-11-11T18:00
In this episode we introduce Houdini! We start by talking about our hooks into the layout engine and CSS parser, so we can connect our custom functionality with s...
Listen
25: Season 1 Wrap Up from 2020-09-16T17:09:54
In this closing episode, we do a whirlwind recap of our entire first season! We go over every episode, from the box model to z-index to animations and functions a...
Listen
24: Blend Modes from 2020-09-09T17:15:15
Today we are talking about CSS blend modes! Blend modes are super fun and allow you to specify how you want elements to interact in terms of their overlapping pix...
Listen
23: Filters from 2020-09-02T17:00
In this episode, we’re talking about CSS filters! We can alter the pixels of our web apps in similar ways to our favorite design tools. From recreating Instagram ...
Listen
22: Animation from 2020-08-26T17:01:02
In this episode, we’re talking about CSS animations. With CSS animations a developer creates a set of keyframes, and then uses a variety of animation properties t...
Listen
21: Gradients from 2020-08-19T17:00
In this episode gradients take the stage as we share syntax secrets, tips and tricks, and probably teach you about repeating-conic-gradient. By the end, you’ll be...
Listen
20: Functions from 2020-08-12T17:00
In this episode we talk about the runtime dynamic side of CSS, commonly recognized as a CSS function. Today, in similar fashion to other episodes, we’ll be doing ...
Listen
19: Z-Index and Stacking Context from 2020-08-05T17:03:35
In today’s episode, we’re talking about z-index and stacking context. This is a pretty in-depth topic, but it's something that we see all the time and it can defi...
Listen
17: Shadows from 2020-07-22T17:02:32
Today we’re talking about shadows! Box shadows, drop shadows, text shadows, and everything in between. Shadows can exist all over our UIs without us even realizin...
Listen
16: Borders from 2020-07-15T17:15:12
Today we’re talking about borders! And while this sounds relatively simplistic, borders in CSS can actually get pretty complex very quickly. It’s not just color a...
Listen
15: Pseudo Selectors from 2020-07-01T17:00
In this episode we break down functional and regular pseudo selectors, CSS’s special hook into encapsulated element states. We can’t control them, but we can leve...
Listen
14: Pseudo Elements from 2020-06-24T17:00
::after and ::before? Pssh, do you know about ::first-letter, ::spelling-error, and ::backdrop? In this episode, we dive into the world of pseudo-elements and dis...
Listen
13: Spacing from 2020-06-17T17:00
In this episode we do our best to cover the many ways to create space on the web. From techniques like HTML entities nbsp; to gap, we cover the clever, hacky and ...
Listen
12: Logical Properties from 2020-05-27T17:00
The days of euro-centric spacing like `margin-top` are limited: instead, say hello to `margin-block-start` to define space that works within any linguistic conte...
Listen
10: Flexbox from 2020-05-13T17:00
In this episode we flex our flexbox knowledge and dive deep into CSS layout using the flexible box model. We talk about content axis’, flex flow, wrapping, order,...
Listen
8: Sizing Units from 2020-04-29T17:00
We’re sizing up sizing in CSS in this episode as we break down all the different lengths and measurements in CSS. CSS makes using these things seamless, it’s grea...
Listen
7: Color Part 2 - Perception from 2020-04-22T21:03:39
Explore perceptual, human-centered, color in this episode as we review latest specs, latest syntaxes, theories and strategies for color on the web in 2020. Listen
6: Color Part 1 - Usage from 2020-04-15T16:08:29
In this part 1 episode, we dive deep into using CSS color. We discuss ways to write and code colors, places they can go, functions you can use on them, and then w...
Listen
5: Inheritance from 2020-04-08T16:00
Inheritance and its effects in CSS are found all over your styles, almost invisibly, until further investigation through devtools or docs. In today’s episode, we ...
Listen
4: The Cascade from 2020-04-01T15:00
The “C” in CSS stands for the cascade! And that’s what today’s show is all about. Learn how the styles you write are affected by other styles, and how it all boil...
Listen
3: Specificity from 2020-03-24T23:00:39
In this episode we talk about how the browser resolves multiple selectors targeting the same subjects and how it determines which style to actually apply. Turns o...
Listen
2: Selectors from 2020-03-18T14:00:52
Get ready to learn some new CSS vocabulary! In this episode we talk about selectors, a syntax used to find elements (subjects) in a tree. CSS uses selectors to bi...
Listen
1: The Box Model from 2020-03-12T19:00
Where do scrollbars go, inside or outside the box? In this episode Una and Adam answer that and much more in their discussion of the CSS box model. Everything in ...
Listen