Foundations
Spacing
Padding and margin utilities from styles/spacing.css. Combine a property, a side and a size: {p|m}{side}-{size}.
Scale
xs0.25remsm0.5remmd1remlg1.5remxl2remxxl3remSides
Leave the side out (p-md) for all sides on the base classes, or use one of the side letters below.
Side suffixes
| Name | Description |
|---|---|
a | All sides (pa-md, ma-md). |
t / b | Top or bottom (pt-sm, mb-lg). |
l / r | Left or right (pl-xs, mr-md). |
x | Left and right (px-md, mx-sm). |
y | Top and bottom (py-xs, my-xl). |
Example
pa-md outside, px-lg py-xs inside
<div class="pa-md">
<div class="px-lg py-xs">pa-md outside, px-lg py-xs inside</div>
</div>