CSS Grid guide

Written on October 3, 2018

I’ve been helping my friend Shaun Moynihan put together his new personal site. One of the features of his new site is a gallery of his work in a layout that can be arranged with various blocks. I thought it was a good reason to use CSS Grid to tackle the layout.

I thought this article covering CSS Grid on Creative Bloq particularly was good in helping me to learn and achieve the layout we were going for. Especially helpful was the parts about using grid-area and grid-template-areas to visually layout the different parts of the layout. They even have a good section on how to handle break points so you have nice responsive grid that changes on device sizes.

Stay in touch

Thanks for reading this article. I'd love to stay in touch and share more tips on programming and side projects with you. Sign up and I'll send you my articles straight to your email, you'll also get a free copy of the light themed version of my Git cheat sheet.
Git cheat sheet preview image