TIL a grid gap trick from a random forum comment fixed my layering problem

I was building a city skyline scene with pure CSS and the buildings kept bleeding into each other. Someone on a dev forum said to stop stacking elements and start using negative grid gaps to create overlap. I tried it on my latest piece, a 3 AM diner with neon signs, and the depth finally popped. Has anyone else used gaps instead of z-index tricks to fake perspective?

1 comments

1 Comment

josephb3519h ago

The "stop stacking elements" part hit me hard because that was my exact problem too. I spent a whole weekend fighting with z-indexes on a product card layout, and every time I fixed one overlap, two more broke somewhere else. Then I saw a similar tip about negative margins and grid gaps and just swapped out my whole approach. It feels almost backwards because you think you need things to be higher in the stack to sit in front, but sometimes you just need to pull the container closer. The neon sign thing you mentioned is perfect too, that glow effect reads way better when it's actually cutting into the building behind it. Once you get it, you never want to go back to the old way.