ShopTalk

659: CSS Carousel Configurator Demos with Adam Argyle

Apr 7, 2025
Guest
Adam Argyle
Adam Argyle, a CSS expert at Google, shares insights on the revolutionary Carousel Configurator designed to enhance web scrolling experiences. He discusses how modern CSS features allow carousels to be built without JavaScript, focusing on accessibility and usability. The conversation dives into dynamic element positioning, the importance of interactivity using CSS properties like 'inert', and innovations in layout techniques. Argyle also touches on creating accessible scroll navigation and the exciting future of CSS in web design.
Ask episode
AI Snips
Chapters
Transcript
Episode notes
ANECDOTE

Carousel Building Challenges

  • Scroll snap was great but adding buttons and pagination dots was difficult.
  • This new CSS feature simplifies building complex carousels.
INSIGHT

Carousel-Specific CSS

  • CSS now has carousel-specific features, unlike previous additions that unlocked broader possibilities.
  • These new features aim to replace JavaScript in carousel creation.
ADVICE

Styling Scroll Buttons

  • Use scroll-button pseudo-elements for carousel controls.
  • Style them with logical properties like inline-start and inline-end.
Get the Snipd Podcast app to discover more snips from this episode
Get the app