Simple 6 column grid

tracery-grid.css

/* Reset */
*,
*:after,
*:before {
  margin: 0;
  padding: 0;
  box-sizing: border-box; /* http://caniuse.com/#search=border-box, known compatibilty to IE8 without issues in this usage */
}

/*
* Grid
* 6 columns but could be adapted to 12
*/

.grid-wrap {
  margin: 0px auto;
  max-width: 1200px;  
  padding: 10px;
  width: 100%;
}

img {
  max-width: 100%;
}

/* Clearing for new rows */
.row:before, .row:after {
  content:"";
  display: table ;
  clear:both;
}

[class*='column-'] {
  float: left;
  min-height: 1px;
  width: 16.66%;
}

.column-1 {
  width: 16.66%;
}

.column-2 {
  width: 33.33%;
}

.column-3 {
  width: 50%;
}

.column-4 {
  width: 66.66%;
}

.column-5 {
  width: 83.33%;
}

.column-6 {
  width: 100%;
}

.padded-column {
  padding: 0px 10px;
}

/*
* Media Queries
*/

/* Tablet Breakpoint */
@media (max-width: 800px) {
  [class*='column-'] {
    width: 100%; /* 100% width for sections, change for your spec */
  }
}

/* Mobile Breakpoint */
@media (max-width: 480px) {
  [class*='column-'] {
    width: 100%; /* 100% width for sections, change for your spec */
  }
}