Adding margins

Names of classes match to the following formula

m{side}{-breakpoints}{-size}

Where the side value corresponds to css style(s):

• t - margin-top
• b - margin-bottom
• s - margin-left (l in v4.x)
• e - margin-right (r in v4.x)
• x - margin-right and margin-left
• y - margin-top and margin-bottom
• the empty value corresponds to all sides

Where size value is one of:

• 0 - removes margin
• 1 - $spacer * .25
• 2 - $spacer * .5
• 3 - $spacer * 1
• 4 - $spacer * 1.5
• 5 - $spacer * 3
• auto - corresponds to auto margins

You can add more sizes by adding entries to the $spacers Sass map variable.

<!-- Adds small margins for small screens and higher.
And for very large screens adds large margins. -->
<div class="m-1 m-xl-4">...</div>