Basscss Responsive White Space
** This module is deprecated in favor of basscss-responsive-margin and basscss-responsive-padding**
Responsive white space margin and padding utilities module for Basscss - http://basscss.com
Margin and padding utilities are based on a global white space scale defined with variables. These utilities use a shorthand naming convention.
Margin and Padding Naming Convention
| Shorthand | Description |
|---|---|
| m | Margin |
| p | Padding |
| t | Top |
| r | Right |
| b | Bottom |
| l | Left |
| x | X-axis (left and right) |
| y | Y-axis (top and bottom) |
| n | Negative (margin only) |
| 1 | --space-1 (default .5rem) |
| 2 | --space-2 (default 1rem) |
| 3 | --space-3 (default 2rem) |
| 4 | --space-4 (default 4rem) |
Prefix Naming Convention
Responsive white space utilities follow the same breakpoint prefix convention as other Basscss modules.
| Prefix | Description |
|---|---|
| (no prefix) | Not scoped to a breakpoint |
| sm- | --breakpoint-sm (default: min-width 40em) |
| md- | --breakpoint-md (default: min-width 52em) |
| lg- | --breakpoint-lg (default: min-width 64em) |
Margins
Change or reset default margins using the global white space scale. Negative x-axis margins are used to offset padding. Margin auto is used to horizontally center block-level elements with a set width.
Padding
Padding utilities are only available in symmetrical orientations. This is to normalize the spacing used around elements.