This module goes hand in hand with the layout module. It serves for telling each
.layout__item its width within the grid. As long as it's not .layout--auto, every .layout__item
needs a width class.
<div class="layout">
<div class="layout__item u-1/3">
Foo
</div>
<div class="layout__item u-1/3">
Bar
</div>
<div class="layout__item u-1/3">
Baz
</div>
</div>
Here, we are telling each .layout__item to take up a width of 1/3 (33.333%).
By default inuitcss creates classes for wholes, halves, thirds, quarters and fifths. You can override the map defined in this module to add more classes (columns).
By default we will create wholes, halves, thirds, quarters, and fifths.
You can create as many columns as you want, predefine this Map to override the number of columns in a row.
$inuit-widths-columns: (
1,
2,
3,
4,
5,
) !default;