Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="outer-container">
  <div class="row">
    <div class="col16">16</div>
  </div>
  <div class="row">
    <div class="col4">4</div>
    <div class="col4">4</div>
    <div class="col4">4</div>
    <div class="col4">4</div>
  </div>
  <div class="row">
    <div class="col8">8</div>
    <div class="col3">3</div>
    <div class="col5">5</div>
  </div>
</div>

SassMeister-input.scss

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// Bourbon (v)
// Neat (v)
// ----

SassMeister-output.css

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  margin-top: 1rem;
  background: #333;
  font-family: Avenir, sans-serif;
}

.outer-container {
  max-width: 80em;
  margin-left: auto;
  margin-right: auto;
}
.outer-container:after {
  content: "";
  display: table;
  clear: both;
}

.row {
  margin-bottom: 1em;
  display: block;
}
.row:after {
  content: "";
  display: table;
  clear: both;
}

.col2, .col3, .col4, .col5, .col6, .col8, .col16 {
  background: fuchsia;
  padding: 1em;
  color: white;
}

.col2 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 10.96186%;
}
.col2:last-child {
  margin-right: 0;
}

.col3 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 17.32172%;
}
.col3:last-child {
  margin-right: 0;
}

.col4 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 23.68159%;
}
.col4:last-child {
  margin-right: 0;
}

.col5 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 30.04146%;
}
.col5:last-child {
  margin-right: 0;
}

.col6 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 36.40133%;
}
.col6:last-child {
  margin-right: 0;
}

.col8 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 49.12106%;
}
.col8:last-child {
  margin-right: 0;
}

.col16 {
  float: left;
  display: block;
  margin-right: 1.75788%;
  width: 100%;
}
.col16:last-child {
  margin-right: 0;
}

SassMeister-rendered.html

<div class="outer-container">
  <div class="row">
    <div class="col16">16</div>
  </div>
  <div class="row">
    <div class="col4">4</div>
    <div class="col4">4</div>
    <div class="col4">4</div>
    <div class="col4">4</div>
  </div>
  <div class="row">
    <div class="col8">8</div>
    <div class="col3">3</div>
    <div class="col5">5</div>
  </div>
</div>