Building a photo gallery has been a tough nut to crack for so many years. Throughout my career, I’ve used <table> layouts, <div>s with brittle margins and set widths, and tried my hand at flexbox. While all of these methods have worked, none of them felt like that silver bullet solution.

Then one day, the CSS gods bestowed upon us the magical power of CSS grids. Now, making a grid-based layout is an absolute delight. And, when we use grids with Tailwind CSS, we can create beautiful, functional UIs in a fraction of the time it used to take. So, let’s hop right in and see how we can use them to make a photo gallery.

• The Set-Up
• Our HTML
• Layouts With CSS Grid
• Mobile Layout
• Styling With Tailwind CSS
• The Wrap-Up

#tailwind css #css grid #css