Completed
- Creating the diamond shape
Class Central Classrooms beta
YouTube videos curated by Class Central.
Classroom Contents
Creating a Diamond Grid with CSS and Animation
Automatically move to the next video in the Classroom when playback concludes
- 1 - Introduction
- 2 - Creating the grid
- 3 - Offsetting the middle row
- 4 - Creating the diamond shape
- 5 - Fitting them closer together
- 6 - Animating the clip-path
- 7 - Failed attempt to keep the round corners on hover
- 8 - The z-index “hack” to keep items in front
- 9 - Making the elements fade out on hover
- 10 - Fixing the rounder corners on hover