Ahmad Shadeed has written another beautifully designed and polished deep-dive but this time all about the gap
property. Sometimes it’s nice to go back in time and remember all the negative-margin hacks and complicated layout-related code we had to write just to space things apart. Thankfully no longer!
Another thing Ahmad’s post reminded me is that not only is gap
straight up easier to use than managing a lot of margin
declarations, but it also prevents layout bugs too. On this thread, Ahmad writes:
Building a UI that doesn’t break is impossible, but at least, you can reduce the issues that might happen:
- Ask questions: what will happen if there is only one item? or do you expect another variation of this component that will do X and Y?
- Make sure to stress-test the UI for any spacing issues.