Spacing
Utility classes for margins and padding
Utility classes for margins and padding
The naming convention for spacing utilities was constructed with the goal of being both semantic and easy to remember. For uniform margins and padding, the location is omitted from the name.
Type | Location | Size |
---|---|---|
margin | top, right, bottom, left, x (horizontal), y (vertical) | 0 - 12 and auto |
padding | top, right, bottom, left, x (horizontal), y (vertical) | 0 - 12 and auto |
Based on a global spacing scale which helps keep horizontal and vertical spacing consistent, margin utilities help reduce the amount of custom CSS that share the same properties and allows for many different page layouts using the same styles.
Uniform spacing utilities are used to apply equal margins to all sides of an element, can change or override default margins and can be used with a spacing scale from 0-12.