Gap vs space-between is one of the most common decision points we see. Here is the honest breakdown.
The short version#
gap is the modern answer for flex/grid gutters; space-between is for non-grid sibling stacks.
Point by point#
| Aspect | Analysis |
|---|---|
| Applies to | gap: flex/grid children; space-*: any siblings via margins |
| Edge behavior | gap never adds edge space; space-* can double with padding |
| Wrapping | gap handles both axes on wrap; space-x breaks wrapped rows |
| Verdict | Use gap in flex/grid; space-y-* for document-flow stacks |
Bottom line#
Pick based on your constraint, not ideology — and remember the comparison pages link to hands-on recipes so you can verify the claim in your own project within minutes.
Related comparisons#
comparisons/index|All comparisons