Margin vs padding is one of the most common decision points we see. Here is the honest breakdown.

The short version#

Margin is space OUTSIDE the box (collapses, transparent); padding is space INSIDE (never collapses, carries background).

Point by point#

AspectAnalysis
BackgroundPadding shows the element background; margin never does
CollapsingVertical margins merge; padding never does
Hit areaPadding enlarges clickable area; margin pushes neighbors
Rule of thumbSpacing from siblings → margin; breathing within a surface → padding

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.

comparisons/index|All comparisons