Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// ----

$grid-widths: (
  1:
  one-whole,

  1/2:
  one-half
  two-quarters
  three-sixths
  four-eighths
  five-tenths
  six-twelfths,

  1/3:
  one-third
  two-sixths
  four-twelfths,

  2/3:
  two-thirds
  four-sixths
  eight-twelfths,

  1/4:
  one-quarter
  two-eighths
  three-twelfths,

  3/4:
  three-quarters
  six-eighths
  nine-twelfths,

  1/5:
  one-fifth
  two-tenths,

  2/5:
  two-fifths
  four-tenths,

  3/5:
  three-fifths
  six-tenths,

  4/5:
  four-fifths
  eight-tenths,

  1/6:
  one-sixth
  two-twelfths,

  5/6:
  five-sixths
  ten-twelfths,

  // Eighths
  1/8: one-eighth,
  3/8: three-eighths,
  5/8: five-eighths,
  7/8: seven-eighths,

  // Tenths
  1/10: one-tenth,
  3/10: three-tenths,
  7/10: seven-tenths,
  9/10: nine-tenths,

  //Twelfths
  1/12: one-twelfth,
  5/12: five-twelfths,
  7/12: seven-twelfths,
  11/12: eleven-twelfths
);


@mixin grid-setup($namespace: "", $property: width) {
  @each $fraction, $widths in $grid-widths {
    $selectors: null;
    $percent: 100% /(1 / $fraction);
    @each $width in $widths {
      $selectors: append(
        $selectors,
        unquote(".#{$namespace}#{$width}"),
        "comma"
      );
    }
    #{$selectors} { #{$property}: $percent; }
  }
}

@include grid-setup();

SassMeister-output.css

.one-whole {
  width: 100%;
}

.one-half, .two-quarters, .three-sixths, .four-eighths, .five-tenths, .six-twelfths {
  width: 50%;
}

.one-third, .two-sixths, .four-twelfths {
  width: 33.33333%;
}

.two-thirds, .four-sixths, .eight-twelfths {
  width: 66.66667%;
}

.one-quarter, .two-eighths, .three-twelfths {
  width: 25%;
}

.three-quarters, .six-eighths, .nine-twelfths {
  width: 75%;
}

.one-fifth, .two-tenths {
  width: 20%;
}

.two-fifths, .four-tenths {
  width: 40%;
}

.three-fifths, .six-tenths {
  width: 60%;
}

.four-fifths, .eight-tenths {
  width: 80%;
}

.one-sixth, .two-twelfths {
  width: 16.66667%;
}

.five-sixths, .ten-twelfths {
  width: 83.33333%;
}

.one-eighth {
  width: 12.5%;
}

.three-eighths {
  width: 37.5%;
}

.five-eighths {
  width: 62.5%;
}

.seven-eighths {
  width: 87.5%;
}

.one-tenth {
  width: 10%;
}

.three-tenths {
  width: 30%;
}

.seven-tenths {
  width: 70%;
}

.nine-tenths {
  width: 90%;
}

.one-twelfth {
  width: 8.33333%;
}

.five-twelfths {
  width: 41.66667%;
}

.seven-twelfths {
  width: 58.33333%;
}

.eleven-twelfths {
  width: 91.66667%;
}