The CSS Podcast

The CSS Podcast
  • 4,8 (56)
  • TECHNOLOGIES
  • CHAQUE SEMAINE
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.

  1. 3 OCT.

    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 functions, color functions, :has() tricks, balanced text wrapping, linear() easing, nesting, anchoring, state queries, view transitions, and scroll driven animation. What a year for CSS! 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; 💀🤘

    43 min

  2. 26 SEPT.

    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, timeline-scope, animation-range, and more. Power those animations with off-the-main-thread CSS scroll animation powers.   Resources: Bramus's Demos: All mentioned Demos + Tools + Video Course + DevTools Extension link → https://goo.gle/3Uw31up  Video Course direct link: https://goo.gle/learn-scroll-driven-animations   Adam's Demos: scroll() the hue wheel → https://goo.gle/4emb3NO  CSS scroll() feature time warp → https://goo.gle/4exH3yv  view() long bento list → https://goo.gle/4gtcCLx  view() scrolly telling → https://goo.gle/3TAq2vA  view() iOS-like app switcher → https://goo.gle/4etvCI6  view() variable font animation → https://goo.gle/4e8eJmd    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; 💀🤘

    47 min

  3. 19 SEPT.

    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 but difficult to master, but not with Bramus here to teach us. He'll be covering introductory to advanced API features and a big bag of examples and demos.  Resources: Developer Documentation → https://goo.gle/4aHY7zo  Quick intro to View Transitions (Google I/O 2023 video) → https://goo.gle/3ZieRLp  What's new in View Transitions? (Google I/O 2024 video) → https://goo.gle/3zeYNj3  Misconceptions about View Transitions → https://goo.gle/3Tpsu7O  Bramus's Demos: Collection of various demos, both SPA and MPA → https://goo.gle/3B4edY8  Accordion → https://goo.gle/3B4egDi     Adam's Demos: Grid gallery → https://goo.gle/4giz0XV  Always great grid → https://goo.gle/3MH68Lu  Flexbox visualizer → https://goo.gle/47kmJOB  Editable tabs → https://goo.gle/4ghNfMx  Dollar number input → https://goo.gle/4e0FsBf  Stateful morphing button → https://goo.gle/4ebBNR2  Drag and Drop → https://goo.gle/3XlP2Yn  Isotope recreation → https://goo.gle/4dVX5lN  Local development animated → https://goo.gle/3XHjm17    Una Kravets (co-host) Twitter → https://goo.gle/452aBRb YouTube → https://goo.gle/457oMnS Making the web more colorful ✨🎨  Web DevRel @googlechrome Unicorn face Host of Tools Today → https://goo.gle/4aI6JpC & Designing in the Browser 🎬  → https://goo.gle/4e4YTcM    Adam Argyle (co-host) Twitter → https://goo.gle/3yFnHYu Instagram → https://goo.gle/3wUb6QJ YouTube → https://goo.gle/4dZNKK7 @GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘 CSSWG → https://goo.gle/4bFErxq VisBug → https://goo.gle/4bDcVQZ     The CSS Podcast  #CSSpodcast

    42 min

  4. 12 SEPT.

    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 detect  if a container is overflowing, when an element is scroll snapped, and when an element is stuck from position: sticky. Resources: :stuck, :snapped, :on-screen, etc → https://goo.gle/3WVhSi6   state queries syntax → https://goo.gle/3T2gI33  explainer → https://goo.gle/3XevW7x  Intent To Prototype → https://goo.gle/3Au8rOY  Scroll Snap Events → https://goo.gle/47koXO1     Una Kravets (co-host) Twitter → https://goo.gle/452aBRb YouTube → https://goo.gle/457oMnS  Making the web more colorful ✨🎨  Web DevRel @googlechrome Unicorn face Host of Tools Today → https://goo.gle/4aI6JpC & Designing in the Browser 🎬  → https://goo.gle/4e4YTcM  Adam Argyle (co-host) Twitter → https://goo.gle/3yFnHYu Instagram → https://goo.gle/3wUb6QJ YouTube → https://goo.gle/4dZNKK7  @GoogleChrome CSS DevRel; @CSSWG; VisBug maker; punk; CSS/JS/UX addict; 💀🤘 CSSWG → https://goo.gle/4bFErxq VisBug → https://goo.gle/4bDcVQZ       The CSS Podcast #CSSpodcast   Watch more The CSS Podcast → https://goo.gle/CSSpodcast  Subscribe to Chrome for Developers → https://goo.gle/ChromeDevs  #CSSPodcast #ChromeForDevelopers #Chrome   Speaker: Una Kravets, Adam Argyle

    23 min

  5. 22 AOÛT

    087: Anchor positioning

    In this episode Una and Adam explain anchor positioning and all its amazing features. Resources: Introducing the CSS anchor positioning API → https://goo.gle/3SWrvM5  CSS anchor positioning → https://goo.gle/4dwgmd9  Tab’s talk from CSS Day → https://goo.gle/4ds8g5B  Una's Anchor Tool → https://goo.gle/3yDYDSd  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; 💀🤘

    38 min

  6. 8 AOÛT

    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 Episode 65 → https://goo.gle/3ygA7X1 CSS Nesting Update → https://goo.gle/3WHCRpK  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; 💀🤘

    8 min

  7. 1 AOÛT

    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 Animation → https://goo.gle/4frnp8y  linear() generator → https://goo.gle/46xs2JZ  Complex animation curves in CSS with linear() → https://goo.gle/4ftm0Oz  Open Props premade spring and bounce variables → https://goo.gle/46uaGOc  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; 💀🤘

    16 min

  8. 11 JUIL.

    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 layout rules for your headings and other copy with just one line of code. Resources: text-wrap on MDN → https://goo.gle/3zvwixd  soft breaks → https://goo.gle/4cXKLAq    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; 💀🤘

    13 min
Tout afficher (91)

4,8
sur 5
56 notes

À propos

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.

Informations

  • Création
    The CSS Podcast
  • Années d’activité
    2020 - 2024
  • Épisodes
    91
  • Classification
    Tous publics
  • Copyright
    2024 © Google Chrome Developers
  • Site web de l’émission
    The CSS Podcast

Vous aimeriez peut‑être aussi

Pour écouter des épisodes au contenu explicite, connectez‑vous.

Recevez les dernières actualités sur cette émission

Connectez‑vous ou inscrivez‑vous pour suivre des émissions, enregistrer des épisodes et recevoir les dernières actualités.
Choisissez un pays ou une région

Afrique, Moyen‑Orient et Inde

Asie‑Pacifique

Europe

Amérique latine et Caraïbes

États‑Unis et Canada