gistfile1.sass

/* 18 Column Grid 
----------------------------------------------------------------------------- 

Span 1:    3.66666666667%
Span 2:    9.33333333333%
Span 3:    15.0%
Span 4:    20.6666666667%
Span 5:    26.3333333333%
Span 6:    32.0%
Span 7:    37.6666666667%
Span 8:    43.3333333333%
Span 9:    49.0%
Span 10:    54.6666666667%
Span 11:    60.3333333333%
Span 12:    66.0%
Span 13:    71.6666666667%
Span 14:    77.3333333333%
Span 15:    83.0%
Span 16:    88.6666666667%
Span 17:    94.3333333333%
Span 18:    100%

----------------------------------------------------------------------------- */	


/* --- Grid variables ---*/ 
$max_columns: 18;
$gutter: 2%;

@mixin span($num, $gutter, $max_columns) {
    $one_col: (100% - ($gutter * ($max_columns - 1))) / $max_columns;
    width:($one_col * $num) + ($gutter * ($num - 1));
    margin-left:$gutter;
    float: left;
}

@mixin span_first {
    margin-left:0;
}

.row {
  width: 100%;
  *zoom: 1;
}
.row:before,
.row:after {
  display: table;
  line-height: 0;
  content: "";
}
.row:after {
  clear: both;
}
.row [class*="span"]:first-child {
  @include span_first;
}

.span1 {
    @include span(1, $gutter, $max_columns);
}
.span2 {
    @include span(2, $gutter, $max_columns);
}
.span3 {
    @include span(3, $gutter, $max_columns);
}
.span4 {
    @include span(4, $gutter, $max_columns);
}
.span5 {
    @include span(5, $gutter, $max_columns);
}
.span6 {
    @include span(6, $gutter, $max_columns);
}
.span7 {
    @include span(7, $gutter, $max_columns);
}
.span8 {
    @include span(8, $gutter, $max_columns);
}
.span9 {
    @include span(9, $gutter, $max_columns);
}
.span10 {
    @include span(10, $gutter, $max_columns);
}
.span11 {
    @include span(11, $gutter, $max_columns);
}
.span12 {
    @include span(12, $gutter, $max_columns);
}
.span13 {
    @include span(13, $gutter, $max_columns);
}
.span14 {
    @include span(14, $gutter, $max_columns);
}
.span15 {
    @include span(15, $gutter, $max_columns);
}
.span16 {
    @include span(16, $gutter, $max_columns);
}
.span17 {
    @include span(17, $gutter, $max_columns);
}
.span18 {
    @include span_first;
    width:100%;
}