Basic susy layout

SassMeister-input-HTML.html

<div class="Page">
  <section class="first"></section>
  <section class="second"></section>
  <section class="third"></section>
</div>

SassMeister-input.scss

// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// Susy (v2.1.3)
// ----

@import "susy";

@include border-box-sizing;

$susy: (
 columns: 12,
 global-box-sizing: border-box,
 debug: (image: show)
);

html, 
body{
 width: 100%;
 height: 100%;
}

.Page {
  height: 100%;
  @include container(1110px);
}

section {
  @include span(4);
  min-height: 100px;
  background: rgba(red, 0.1);
  &:last-child {
    @include last;
  }
}

SassMeister-output.css

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
}

.Page {
  height: 100%;
  max-width: 1110px;
  margin-left: auto;
  margin-right: auto;
  background-image: linear-gradient(to right, rgba(102, 102, 255, 0.25), rgba(179, 179, 255, 0.25) 80%, transparent 80%);
  background-size: 8.4745762712%;
  background-origin: content-box;
  background-clip: content-box;
  background-position: left top;
}
.Page:after {
  content: " ";
  display: block;
  clear: both;
}

section {
  width: 32.2033898305%;
  float: left;
  margin-right: 1.6949152542%;
  min-height: 100px;
  background: rgba(255, 0, 0, 0.1);
}
section:last-child {
  float: right;
  margin-right: 0;
}

SassMeister-rendered.html

<div class="Page">
  <section class="first"></section>
  <section class="second"></section>
  <section class="third"></section>
</div>