Spent 3 hours fighting a flexbox gap issue that was one missing property

I was building this card layout and the gaps between items just would not behave across browsers. Thought I was losing my mind checking margins over and over. Turns out I forgot to set the container to display:flex before applying the gap values. The second I added it everything snapped into place. Anyone else ever waste way too long on something that was literally one line off?

2 comments

2 Comments

the_gray7d ago

Tbh I read somewhere that flexbox gap isn't even supported on older Safari versions, so sometimes it's not even your code that's the problem. That missing display:flex thing has got me before too though, drives you nuts.

tyler8227d ago

Switching to the browser dev tools inspect mode saved me hours on that one.