Generated by SassMeister.com.

twelve.scss

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

$ends: 3,4,6,8,12;
$gutterSize: 2%;
@each $end in $ends {
  @for $i from 1 through $end {
    $single--column: (100 - (($end - 1)*$gutterSize )) / $end;
    %col-#{$i}-#{$end} {
        float: left;
        width: ($i*$single--column) + (($i - 1)*$gutterSize);
        @if $i == $end {} @else {
          margin-right: $gutterSize;
          &:last-child { margin-right: 0; }
        }
    }
  }
}


@mixin column-width($n, $context, $margin: 2%) {
    $width: (100% - (($context - 1) * $margin))/$context;
    float: left;
    width: ($n*$width) + (($n - 1) * $margin);
    @if $n == $context {} @else {
      margin-right: $margin;
      &:last-child { margin-right: 0; }
    }
}

.main--content {
  @include column-width(9, 12)
}

.sidebar {
  @extend %col-3-12;
}