Simple grid example

simple-grid.scss

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

.row {
  margin-left: -20px;
  margin-right: -20px;

  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

.col {
  float: left;
  padding-left: 20px;
  padding-right: 20px;
  width: 100%;

  &:last-of-type {
    padding-right: 0;
  }
}

@media screen and (min-width: 420px) {
  .s3 { width: 33.3333333%; }
  .s4 { width: 25%; }
  .s6 { width: 50%; }
  .s8 { width: 75%; }
}

@media screen and (min-width: 980px) {
  .m3 { width: 33.3333333%; }
  .m4 { width: 25%; }
  .m6 { width: 50%; }
  .m8 { width: 75%; }
}

usage.html

<div class="row">
  <div class="col s6 m3"></div>
  <div class="col s6 m3"></div>
  <div class="col s6 m3"></div>
  <div class="col s6 m3"></div>
  <div class="col s6 m3"></div>
  <div class="col s6 m3"></div>
</div>