A SASS 3.2 compatible fix for the Foundation grid system in IE 7/8

_lt-ie9-foundation-grid.scss

@charset "UTF-8";

/**

  IE 7/8 FIX FOR ZURB FOUNDATION 4 GRID

  About: A SASS 3.2 compatible fix for the Foundation grid system in IE 7/8
  Author: Zak MacDonald <http://github.com/zakmac>
  Origin: https://gist.github.com/hatefulcrawdad/5068210
  Fork:   https://gist.github.com/zakmac/66f910ddfa3b5cc6b404
  JSBin:  https://jsbin.com/cexuni/edit?css

**/

$z: 1;
$col-width: 100%;

.lt-ie9 {

  .row {
    margin: 0 auto;
    max-width: 100%;
    min-width: 768px;
    width: 940px;

    [class*="column"] + [class*="column"]:last-child {
      float: right;
    }

    [class*="column"] + [class*="column"].end {
      float: left;
    }

    &.large-collapse .column, 
    &.large-collapse .columns {
      padding: 0;
    }

    .column,
    .columns {  
      float: left;
      min-height: 1px;
      padding: 0 15px;
      position: relative;

      &.large-centered {
        float: none;
        margin: 0 auto;
      }

      @while $z <= 12 {
        
        $col-width: (100% / 12) * $z;
 
        .large-#{$z} {
          width: $col-width;
        }
        
        @if $z <= 10 {
          
          .large-offset-#{$z} {
            margin-left: $col-width;
          }
          
          @if $z >= 2 {
            
            .pull-#{$z} {
              right: $col-width;
            }
            
            .push-#{$z} {
              left: $col-width;
            }
          }
        }
        
        $z: $z + 1;
      }
    }

    .row {
      margin: 0 -15px;
      max-width: none;
      min-width: 0;
      width: auto;

      &.large-collapse {
        margin: 0;
      }
    }

    // Nicolas Gallagher's micro clearfix
    & {
      *zoom: 1;
    
      &:after,
      &:before {
        content: " ";
        display: table;
      }
      &:after { clear: both; }
    }
  } // .row
}

lt-ie9-foundation-grid.css

/**

  IE 7/8 FIX FOR ZURB FOUNDATION 4 GRID

  About: A SASS 3.2 compatible fix for the Foundation grid system in IE 7/8
  Author: Zak MacDonald <http://github.com/zakmac>
  Origin: https://gist.github.com/hatefulcrawdad/5068210
  Fork:   https://gist.github.com/zakmac/66f910ddfa3b5cc6b404
  JSBin:  https://jsbin.com/cexuni/edit?css

**/

.lt-ie9 .row {
  margin: 0 auto;
  max-width: 100%;
  min-width: 768px;
  width: 940px;
}
.lt-ie9 .row [class*="column"] + [class*="column"]:last-child {
  float: right;
}
.lt-ie9 .row [class*="column"] + [class*="column"].end {
  float: left;
}
.lt-ie9 .row.large-collapse .column, .lt-ie9 .row.large-collapse .columns {
  padding: 0;
}
.lt-ie9 .row .column,
.lt-ie9 .row .columns {
  float: left;
  min-height: 1px;
  padding: 0 15px;
  position: relative;
}
.lt-ie9 .row .column.large-centered,
.lt-ie9 .row .columns.large-centered {
  float: none;
  margin: 0 auto;
}
.lt-ie9 .row .column .large-1,
.lt-ie9 .row .columns .large-1 {
  width: 8.33333%;
}
.lt-ie9 .row .column .large-offset-1,
.lt-ie9 .row .columns .large-offset-1 {
  margin-left: 8.33333%;
}
.lt-ie9 .row .column .large-2,
.lt-ie9 .row .columns .large-2 {
  width: 16.66667%;
}
.lt-ie9 .row .column .large-offset-2,
.lt-ie9 .row .columns .large-offset-2 {
  margin-left: 16.66667%;
}
.lt-ie9 .row .column .pull-2,
.lt-ie9 .row .columns .pull-2 {
  right: 16.66667%;
}
.lt-ie9 .row .column .push-2,
.lt-ie9 .row .columns .push-2 {
  left: 16.66667%;
}
.lt-ie9 .row .column .large-3,
.lt-ie9 .row .columns .large-3 {
  width: 25%;
}
.lt-ie9 .row .column .large-offset-3,
.lt-ie9 .row .columns .large-offset-3 {
  margin-left: 25%;
}
.lt-ie9 .row .column .pull-3,
.lt-ie9 .row .columns .pull-3 {
  right: 25%;
}
.lt-ie9 .row .column .push-3,
.lt-ie9 .row .columns .push-3 {
  left: 25%;
}
.lt-ie9 .row .column .large-4,
.lt-ie9 .row .columns .large-4 {
  width: 33.33333%;
}
.lt-ie9 .row .column .large-offset-4,
.lt-ie9 .row .columns .large-offset-4 {
  margin-left: 33.33333%;
}
.lt-ie9 .row .column .pull-4,
.lt-ie9 .row .columns .pull-4 {
  right: 33.33333%;
}
.lt-ie9 .row .column .push-4,
.lt-ie9 .row .columns .push-4 {
  left: 33.33333%;
}
.lt-ie9 .row .column .large-5,
.lt-ie9 .row .columns .large-5 {
  width: 41.66667%;
}
.lt-ie9 .row .column .large-offset-5,
.lt-ie9 .row .columns .large-offset-5 {
  margin-left: 41.66667%;
}
.lt-ie9 .row .column .pull-5,
.lt-ie9 .row .columns .pull-5 {
  right: 41.66667%;
}
.lt-ie9 .row .column .push-5,
.lt-ie9 .row .columns .push-5 {
  left: 41.66667%;
}
.lt-ie9 .row .column .large-6,
.lt-ie9 .row .columns .large-6 {
  width: 50%;
}
.lt-ie9 .row .column .large-offset-6,
.lt-ie9 .row .columns .large-offset-6 {
  margin-left: 50%;
}
.lt-ie9 .row .column .pull-6,
.lt-ie9 .row .columns .pull-6 {
  right: 50%;
}
.lt-ie9 .row .column .push-6,
.lt-ie9 .row .columns .push-6 {
  left: 50%;
}
.lt-ie9 .row .column .large-7,
.lt-ie9 .row .columns .large-7 {
  width: 58.33333%;
}
.lt-ie9 .row .column .large-offset-7,
.lt-ie9 .row .columns .large-offset-7 {
  margin-left: 58.33333%;
}
.lt-ie9 .row .column .pull-7,
.lt-ie9 .row .columns .pull-7 {
  right: 58.33333%;
}
.lt-ie9 .row .column .push-7,
.lt-ie9 .row .columns .push-7 {
  left: 58.33333%;
}
.lt-ie9 .row .column .large-8,
.lt-ie9 .row .columns .large-8 {
  width: 66.66667%;
}
.lt-ie9 .row .column .large-offset-8,
.lt-ie9 .row .columns .large-offset-8 {
  margin-left: 66.66667%;
}
.lt-ie9 .row .column .pull-8,
.lt-ie9 .row .columns .pull-8 {
  right: 66.66667%;
}
.lt-ie9 .row .column .push-8,
.lt-ie9 .row .columns .push-8 {
  left: 66.66667%;
}
.lt-ie9 .row .column .large-9,
.lt-ie9 .row .columns .large-9 {
  width: 75%;
}
.lt-ie9 .row .column .large-offset-9,
.lt-ie9 .row .columns .large-offset-9 {
  margin-left: 75%;
}
.lt-ie9 .row .column .pull-9,
.lt-ie9 .row .columns .pull-9 {
  right: 75%;
}
.lt-ie9 .row .column .push-9,
.lt-ie9 .row .columns .push-9 {
  left: 75%;
}
.lt-ie9 .row .column .large-10,
.lt-ie9 .row .columns .large-10 {
  width: 83.33333%;
}
.lt-ie9 .row .column .large-offset-10,
.lt-ie9 .row .columns .large-offset-10 {
  margin-left: 83.33333%;
}
.lt-ie9 .row .column .pull-10,
.lt-ie9 .row .columns .pull-10 {
  right: 83.33333%;
}
.lt-ie9 .row .column .push-10,
.lt-ie9 .row .columns .push-10 {
  left: 83.33333%;
}
.lt-ie9 .row .column .large-11,
.lt-ie9 .row .columns .large-11 {
  width: 91.66667%;
}
.lt-ie9 .row .column .large-12,
.lt-ie9 .row .columns .large-12 {
  width: 100%;
}
.lt-ie9 .row .row {
  margin: 0 -15px;
  max-width: none;
  min-width: 0;
  width: auto;
}
.lt-ie9 .row .row.large-collapse {
  margin: 0;
}
.lt-ie9 .row {
  *zoom: 1;
}
.lt-ie9 .row:after, .lt-ie9 .row:before {
  content: " ";
  display: table;
}
.lt-ie9 .row:after {
  clear: both;
}