Inside stylesheet css/base-sizing.css you can see there are lots of predefined classes.

My motivation to do this, add predefined classes for custom margins and paddings is that, because of spacing inconsistency and desire of providing a good flexibility. The margins/paddings are

• 5px, 10px, 15px, 20px, 25px, 30px, 35px, 40px, 45px, 50px
• 60px, 70px, 80px, 90px, 100px, 110px, 120px, 130px, 140px, 150px

So the classes structure would be:

For margins:

• Top: mt-##, example classes: mt-20 , mt-40, mt-100 etc.
• Bottom: mb-##, eg: mb-20, mb-40, mb-100 etc.
• Left: ml-##, eg: ml-20, ml-40, ml-100 etc.
• Right: mr-##, eg: mr-20, mr-40, mr-100 etc.

For paddings:

• Top: ptop-##, example classes: ptop-20 , ptop-40, ptop-100 etc.
• Bottom: pbottom-##, eg: pbottom-20, pbottom-40, pbottom-100 etc.
• Left: p-left-##, eg: pleft-20, pl-40, pleft-100 etc.
• Right: p-right-##, eg: p-right-20, p-right-40, p-right-100 etc.

These are all preset classes and it’s your choice whether you should use them or not.