3 Grid Columns with one in the middle that's wider than the others (Generated by SassMeister.com)

browserslist

> 1%
last 2 versions

SassMeister-input.scss

// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// ----

// Three Columns with one that is wider than the others 
$module: 'unequal-columns';

.#{$module} {
  // Module Variables: contexts from a PSD design file
  // COLUMNS
  $width-reg-col-px: 340px; // right and left columns
  $num-reg-cols: 2;
  $width-feat-col-px: 380px; // middle column
  $num-feat-cols: 1;
  // GUTTERS
  $width-col-gutters: 20px;
  $width-col-gutters-split: ($width-col-gutters / 2);
  // TOTALS
  $total-num-cols: $num-reg-cols + $num-feat-cols;
  $total-width-reg-cols: $width-reg-col-px * $num-reg-cols;
  $total-width-feat-cols: $width-feat-col-px * $num-feat-cols;
  $total-width-col-gutters: $total-num-cols * $width-col-gutters;
  $programs-total-width: $total-width-reg-cols + $total-width-feat-cols + $total-width-col-gutters;
  $column-width-reg-col: percentage(($width-reg-col-px + $width-col-gutters)/ $programs-total-width);
  $column-width-feat-col: percentage(($width-feat-col-px + $width-col-gutters)/ $programs-total-width);
  // Test the total for possible rounding errors. Should be 100%
  $total-row-width-cols-percent: ($column-width-reg-col * 2) + $column-width-feat-col; 


	
  .row {
  	width: $total-row-width-cols-percent;
  	max-width: $programs-total-width;
  	padding: 20px;
  	text-align: center;
  }
  .column {
  	position: relative;
  	float: left;
  	width: 100%;
  	min-height: 1px;
  	padding-left: 0;
  	padding-right: 0;
  }
  .regular-column {
  	width: $column-width-reg-col;
  }
  .featured {
  	width: $column-width-feat-col;
  }
  .percentage-checksum {
  	width: ($column-width-reg-col * 2) + $column-width-feat-col;
  }


}

SassMeister-output.css

.unequal-columns .row {
  width: 100%;
  max-width: 1120px;
  padding: 20px;
  text-align: center;
}
.unequal-columns .column {
  position: relative;
  float: left;
  width: 100%;
  min-height: 1px;
  padding-left: 0;
  padding-right: 0;
}
.unequal-columns .regular-column {
  width: 32.14285714%;
}
.unequal-columns .featured {
  width: 35.71428571%;
}
.unequal-columns .percentage-checksum {
  width: 100%;
}