Grokking CSS Design Patterns to Ace Interviews/

...

/

Problem: Glass 3D Carousel

Problem: Glass 3D Carousel

Try to create a continuously rotating 3D carousel of glass-style cards with auto-spin and hover pause using only CSS.

We'll cover the following...

Problem description

Given HTML markup with a .carousel container housing a .carousel-inner and multiple .carousel-item elements, write CSS to:

  • Apply a 3D perspective to .carousel.

  • Use transform-style: preserve-3d on .carousel-inner and animate it rotating around the Y-axis infinitely. ...