Generated by SassMeister.com.

SassMeister-input-HTML.html

<h1>Susy Grid System Example</h1>

<div class="twelve-columns">
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
</div>

SassMeister-input.scss

// ----
// libsass (v3.2.4)
// ----

@import "susy";

$susy: (
  columns: 12,
  gutters: .25,
  gutter-position: inside,
);

.twelve-columns {
  @include container();
  background-color: maroon;
  padding-top: 10px;
  padding-bottom: 10px;
  
  > div {
    @include span(1 of 12);
    background-color: blue;
    padding-top: 10px;
    padding-bottom: 10px;
    
    &:nth-child(even) {
      background-color: green;
    }
    
    > div {
      background-color: orange;
      width: 100%;
      min-height: 70px;
    }
  }
}

SassMeister-output.css

.twelve-columns {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: maroon;
  padding-top: 10px;
  padding-bottom: 10px;
}

.twelve-columns:after {
  content: " ";
  display: block;
  clear: both;
}

.twelve-columns > div {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 8.33333%;
  float: left;
  padding-left: 0.83333%;
  padding-right: 0.83333%;
  background-color: blue;
  padding-top: 10px;
  padding-bottom: 10px;
}

.twelve-columns > div:nth-child(even) {
  background-color: green;
}

.twelve-columns > div > div {
  background-color: orange;
  width: 100%;
  min-height: 70px;
}

SassMeister-rendered.html

<h1>Susy Grid System Example</h1>

<div class="twelve-columns">
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
  <div>
    <div>some content would go here</div>
  </div>
</div>