Fluid grid mixin

fluid-grid.scss

@mixin fluid-grid($cols:12, $gutter:1%, $grid-max-width:960px, $internal-lateral-padding:5%) {
 
  .grid {
    max-width: #{$grid-max-width};
    margin: 0 auto;
    padding: 0 #{$internal-lateral-padding};
    &>* {
      float: left;
    }
    @include clearFloat()
  }
    
  div[class^="col"] {
    &:not(:last-child) {
      margin-right: $gutter/2;
    }
    &:not(:first-child) {
      margin-left: $gutter/2;
    }
  }
  
  @for $i from 1 through $cols{
    
    $ratio: $cols/$i;
     
    .col-#{$i}-#{$cols}{
      width: (100%-($ratio - 1)*$gutter)/$ratio  
    }
      
  
  }
    
}

@mixin clearFloat() {
  &::after {
    display: block;
    clear: both;
    content: ''
  }
}