Spacing
The classes are named using the format:
{property}{sides}-{size} for xs
{property}{sides}-{breakpoint}-{size} for sm, md, lg, and xl.
| Property | Description |
|---|---|
| m | margin |
| p | padding |
| Sides | Description |
|---|---|
| t | top |
| b | bottom |
| s (start) | left |
| e (end) | right |
| x | left and right |
| y | top and bottom |
| blank | all sides (top, bottom, left and right) |
| Size | Description |
|---|---|
| 0 | removes all margin or padding |
| 1 | sets margin or padding to $spacer * 0.25 |
| 2 | sets margin or padding to $spacer * 0.5 |
| 3 | sets margin or padding to $spacer |
| 4 | sets margin or padding to $spacer * 1.5 |
| 5 | [Beets custom] sets margin or padding to $grid-gutter-width (30px) |
| 6 | [5 in Bootstrap] sets margin or padding to $spacer * 3 |
| auto | sets margin or padding to auto |