margin
The margin shorthand sets transparent space outside an element's border on all four sides.
Syntax
margin: <top> <right> <bottom> <left>; /* 1 to 4 values */
Examples
.center { margin: 0 auto; max-width: 60ch; }
.section { margin-block: 3rem; }
Output
Horizontally centers a fixed-width block and adds 3rem vertical spacing above and below sections.
Notes
margin:auto on a block with a width centers it horizontally. Adjacent vertical margins collapse. Prefer logical properties (margin-block, margin-inline) for writing-mode independence. Negative margins are allowed.
Browser & runtime support
| Environment | Since version |
|---|---|
| chrome | 1.0 |
| firefox | 1.0 |
| safari | 1.0 |
| edge | 12 |