The CSS Podcast
Podrobnosti kanálu
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 Bramus Van Damme, Developer Advocates from Google, who gleefully breakdown complex aspects of CSS i...
Nedávné epizody
92 epizod
92: CSS if() and custom functions
Welcome back to the new season of the CSS Podcast, where Una and Bramus are your guides, your cohosts, and your CSS best friends.
In th...

091: Season 5 Wrap-up
Una and Adam recap the season! They share their favorite features, stories, and use cases. Season 5 covered popovers, dialogs, top layers, trig functi...

090: Scroll-driven animations
In this episode our esteemed guest returns! This time to help us grok Scroll Driven Animation. Learn all about scroll(), view(), animation-timeline, t...

089: View transitions
In this episode Una and Adam bring on an esteemed guest Bramus, who brings us deep knowledge on View Transitions. These are easy to get started with b...

088: State queries
In this episode, Una and Adam discuss a future web capability that builds on container queries: state queries. From CSS, this feature will be able to...

087: Anchor positioning
In this episode Una and Adam explain anchor positioning and all its amazing features.
Resources:
Introducing the CSS anchor positioning A...

086: Nesting 2024+
In this episode Una and Adam catch you up to the latest syntax features of CSS nesting.
Resources:
Episode 47 → https://goo.gle/3SvM9T4

085: Linear easing function fun
In this episode Una and Adam cover the linear() CSS easing function that can create bounce and spring effects.
Resources:
Ep 22 on...

084: Text Wrap
In this episode Una and Adam talk about text wrap, a great modern improvement to typography on the web platform. Learn how you can create logical layo...

083: :has() tips and tricks
In this episode Una and Adam expand on episode 61 about :has() by focusing specifically on use cases, tips and tricks. Get inspired and discover new w...

082: What's new in color & color functions
In this episode Una and Adam provide a color update, covering changes to the specs and new functions.
Links
RCS calc() tool → https://go...

081: Trigonometric Functions
In this episode Una and Adam share practical use cases, syntax and strategies for all the new math functions in CSS. From trig to algebra, they'll hel...

80: Animating to and from top-layer
In this episode Una and Adam continue talking about dialogs and popovers, but this time it's all about animating them into and out of the top layer.....

79: Popover and Dialog
The CSS Podcast is back, with an episode highlighting the popover API and dialog element! Learn what they can do, and when to use which when.
Li...

78: Season 4 wrap!
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 ala...

77: Why isn't percentage working here?
In this episode, Una and Adam talk about percentage resolution for various properties like font-size, padding height and width. They break down and ex...

76: Why isn't my element stuck where I wanted it to stick?
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...

75: Why isn't my custom property the value I expect?
In this episode, Una and Adam discuss common gotchas with custom properties, which often feel fully reactive during use, but their limits and implemen...

74: How do I center a div?
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 hav...

73: Why is my animation glitching?
On this episode of the #CSSpodcast, we’re diving into how to deal with glitchy animations in your code base!
Links:
MDN transform-...

72: Why does my gradient have muddy colors in the middle?
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...

71: Why do I have layout shift?
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...

70: Why is my image distorted?
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...

69: Why is it overflowing?
In this episode we're overjoyed to overexplain why you may be having overflow in your page. somewhere over the rainbow, an overheating developer overc...

68: Why isn't the margin applying?
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 yo...

67: Why isn't z-index working?
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 l...

66: Season 3 recap & what’s next!
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...

65: Nesting
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 bu...

64: Subgrid
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...

63: Media query range syntax
Media query range syntax is a really nice addition.
Links
Una Kravets (co-host)
Twitter | Instagram | YouTube

62: Color functions: An update
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 co...

61 :has()
: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...

60: Inert
In this episode Una and Adam explain a non-CSS property, but very relevant front-end UI property, called inert. It's a way to have a visually guarded...

59: Container queries
Container queries (also known as @container) are a new entrypoint for truly component-based responsive design. In this episode, Adam and Una will walk...

58: Cascade layers
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 hel...

57: DevTools Mini Series - Interaction
DevTools Mini Series continues, this time on interactions. Una Kravets and Adam Argyle are joined by Jecelyn Yeen to discuss interaction, and interact...

56: DevTools Mini Series - Accessibility
DevTools Mini Series continues, this time on accessibility tooling. Una Kravets and Adam Argyle are joined by Jecelyn Yeen to discuss how DevTools can...

55: DevTools Mini Series - Layout
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...

54: DevTools Mini Series - Color
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 overvie...

53: Season 2 wrap up
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...