Padding


All

Multiples of 5, Max:100
p-a-{5x}
  <div class="p-a-15">
                            15px padding
                            </div>
                          
  <div class="p-a-0">
                            no padding
                            </div>
                          

Directional

Multiples of 5, Max:100
p-t-{5x}
p-r-{5x}
p-b-{5x}
p-l-{5x}
p-h-{5x}
p-v-{5x}
  <div class="p-t-0">
                            no top padding
                            </div>
                          
  <div class="p-r-30">
                            30px right padding
                            </div>
                          
  <div class="p-b-40">
                            40px bottom padding
                            </div>
                          
  <div class="p-l-50">
                            50px left padding
                            </div>
                          
  <div class="p-h-10">
                            10px horizontal (left and right) padding
                            </div>
                          
  <div class="p-v-30">
                            35px vertical (top and bottom) padding
                            </div>
                          

Margin


All

Multiples of 5, Max:100
m-a-{5x}
  <div class="m-a-15">
                            15px margin
                            </div>
                          
  <div class="m-a-0">
                            no margin
                            </div>
                          

Directional

Multiples of 5, Max:100
m-t-{5x}
m-r-{5x}
m-b-{5x}
m-l-{5x}
m-h-{5x}
m-v-{5x}
  <div class="m-t-0">
                            no top margin
                            </div>
                          
  <div class="m-r-30">
                            30px right margin
                            </div>
                          
  <div class="m-b-40">
                            40px bottom margin
                            </div>
                          
  <div class="m-l-50">
                            50px left margin
                            </div>
                          
  <div class="m-h-50">
                            50px horizontal (left and right) margin
                            </div>
                          
  <div class="m-v-40">
                            40px vertical (top and bottom) margin
                            </div>
                          

Auto

m-t-a
m-r-a
m-b-a
m-l-a
m-h-a
m-v-a
m-a-a
  <div class="m-t-a">
                            auto top margin
                            </div>
                          
  <div class="m-r-a">
                            auto right margin
                            </div>
                          
  <div class="m-b-a">
                            auto bottom margin
                            </div>
                          
  <div class="m-l-a">
                            auto left margin
                            </div>
                          
  <div class="m-h-a">
                            auto horizontal (left and right) margin
                            </div>
                          
  <div class="m-v-a">
                            auto vertical (top and bottom) margin
                            </div>
                          
  <div class="m-a-a">
                            auto all directions margin
                            </div>