Appreciation post: I finally gave up on my old float-based gallery code

After my friend in Boston showed me how to build the same thing with just 5 lines of grid-template-areas, I rewrote the whole thing last night. Has anyone else found a specific property that just clicked and saved them a ton of time?

2 comments

2 Comments

the_ben21h ago

Grid-template-areas was the same turning point for me. I spent a whole weekend trying to line up a complex sidebar layout with floats and clearfix hacks. Saw a demo using named areas and rebuilt it in twenty minutes. It feels like cheating after all those years.

morgan.cameron20h ago

My big moment was trying to make a three column card layout with flexbox. I had weird gaps and the wrapping was a total mess. Then I sketched the grid on paper with letters like "h" for header and "f" for footer. Typing those names into the CSS and just dropping items in felt like magic. It finally made visual sense instead of just hoping the math worked out.