Sass fluid grid generator mixin based on Twitter Bootstrap fluid grid.

_fluid-grid-generator-mixin.scss

// =======================================================================
// Fluid Grid Generator Mixin
// +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
// 
// Based on fluid grid from http://twitter.github.com/bootstrap/
// =======================================================================
// 
//
// Parameters 
// =======================================================================
// $number-of-columns - Number of columns for generated grid. 
// $gutter-width - Width of gutter for generated grid. (must be percentage value.)
// $row-class-name - Class name for rows in generated grid.
// $column-class-name - Class name for columns in generated grid.
//
// Example @include.
// =======================================================================
// @include fluid-grid-generator (12, 2.5%, row, columns);

@mixin fluid-grid-generator ($number-of-columns, $gutter-width, $row-class-name, $column-class-name) {

  // Row styles.
  // =====================================================================
  .#{$row-class-name} {
    width: 100%; 
    *zoom: 1;
    
    &:before,
    &:after {
      display: table ;
      content: "";
    }

    &:after {
      clear: both;
    }

    // Column styles. (any direct children of a row)
    // =====================================================================
    & > *{
      display: block;
      float: left;
      margin-left: $gutter-width;

      &:first-child {
        margin-left: 0;
      }
    }
  } // End of row styles.

  // Individual column widths generator.
  // =====================================================================

  // Set width of each column.
  $column-width: (100% - $gutter-width * ($number-of-columns - 1)) / $number-of-columns;

  // Set counter to equal number of columns.
  $i: $number-of-columns;

  // For each column calculate width.
  @while $i > 0 {
  %#{$column-class-name}#{$i} { 
      width: ($column-width * $i) + ($gutter-width * ($i - 1));
    }
    $i: $i - 1;
  } // End of individual column widths generator.

} // End of Fluid Grid Generator Mixin.