#179: A Grid of Squares

Avatar of Chris Coyier
Chris Coyier on

AWS Amplify - the fastest, easiest way to develop mobile and web apps that scale.

Download Video
(Only MVP Supporters can download original high-quality recordings for offline viewing.)

Using CSS grid to make a grid, is, well, the whole point. But what if you want all those grid items to maintain an aspect ratio, like a 1:1 square? It’s possible, but it involves a little trickery. In this video, we’ll look at doing that because we want to put a logo, centered, in each square.

One of the final demos: