Size
Responsive component for determining widths
A utility object that can be combined with other objects to determine widths using a 12 column grid
Usage
Settings
In /stylesheets/settings/_settings.grid.scss you can choose your gutter size.
Classes
| Class | Description |
|---|---|
| o-size--full | Fills 100% of the available width |
| o-size--1 | One grid cell of 12 |
| o-size--11 | Eleven grid cells of 12 |
c-demo
6
6
4
4
4
3
3
3
3
Responsive modifiers
The 12/16 column grid is also available at all the different breakpoints (except xxs).
| Class | Description |
|---|---|
| o-size@xs--full | Fills 100% of the available width from 'xs' and upwards |
| o-size@sm--6 | Six grid cells of 12 from 'sm' and upwards |