Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.14)
// Compass (v1.0.0.rc.1)
// ----

$sizes: (
  -es: 10px,
  -s: 20px,
  -m: 30px,
  -l: 40px,
  -el: 50px
);

@each $rule in padding, margin{
  $rule-prefix: str-slice($rule, 0, 1);
  @each $direction in "", -top, -right, -bottom, -left{
    $direction-prefix: str-slice($direction, 0, 2);
    @each $size-name, $size in $sizes{
      $class-name: $rule-prefix + $direction-prefix + $size-name;
      $rule-name: $rule + $direction;
      .#{$class-name}{
          #{$rule-name}: $size;
      }
    }
  }
}

SassMeister-output.css

.p-es {
  padding: 10px;
}

.p-s {
  padding: 20px;
}

.p-m {
  padding: 30px;
}

.p-l {
  padding: 40px;
}

.p-el {
  padding: 50px;
}

.p-t-es {
  padding-top: 10px;
}

.p-t-s {
  padding-top: 20px;
}

.p-t-m {
  padding-top: 30px;
}

.p-t-l {
  padding-top: 40px;
}

.p-t-el {
  padding-top: 50px;
}

.p-r-es {
  padding-right: 10px;
}

.p-r-s {
  padding-right: 20px;
}

.p-r-m {
  padding-right: 30px;
}

.p-r-l {
  padding-right: 40px;
}

.p-r-el {
  padding-right: 50px;
}

.p-b-es {
  padding-bottom: 10px;
}

.p-b-s {
  padding-bottom: 20px;
}

.p-b-m {
  padding-bottom: 30px;
}

.p-b-l {
  padding-bottom: 40px;
}

.p-b-el {
  padding-bottom: 50px;
}

.p-l-es {
  padding-left: 10px;
}

.p-l-s {
  padding-left: 20px;
}

.p-l-m {
  padding-left: 30px;
}

.p-l-l {
  padding-left: 40px;
}

.p-l-el {
  padding-left: 50px;
}

.m-es {
  margin: 10px;
}

.m-s {
  margin: 20px;
}

.m-m {
  margin: 30px;
}

.m-l {
  margin: 40px;
}

.m-el {
  margin: 50px;
}

.m-t-es {
  margin-top: 10px;
}

.m-t-s {
  margin-top: 20px;
}

.m-t-m {
  margin-top: 30px;
}

.m-t-l {
  margin-top: 40px;
}

.m-t-el {
  margin-top: 50px;
}

.m-r-es {
  margin-right: 10px;
}

.m-r-s {
  margin-right: 20px;
}

.m-r-m {
  margin-right: 30px;
}

.m-r-l {
  margin-right: 40px;
}

.m-r-el {
  margin-right: 50px;
}

.m-b-es {
  margin-bottom: 10px;
}

.m-b-s {
  margin-bottom: 20px;
}

.m-b-m {
  margin-bottom: 30px;
}

.m-b-l {
  margin-bottom: 40px;
}

.m-b-el {
  margin-bottom: 50px;
}

.m-l-es {
  margin-left: 10px;
}

.m-l-s {
  margin-left: 20px;
}

.m-l-m {
  margin-left: 30px;
}

.m-l-l {
  margin-left: 40px;
}

.m-l-el {
  margin-left: 50px;
}