CSS grid generator. Based on https://www.sitepoint.com/understanding-css-grid-systems/ formula

gengrid.js

var mc = 12 // maximum columns
var m = 2 // margin in %

var scw = (100 - (m * (mc - 1))) / mc
var str = `
.row, 
.column {
  box-sizing: border-box;
}
 
.row:before,
.row:after {
  content: " ";
  display: table;
}
 
.row:after {
  clear: both;
}
 
.column {
  position: relative;
  float: left;
}
 
.column + .column {
  margin-left: ${m}%;
}
`

for (var i = 0; i < mc; i++) {
  let cw = (scw * (i + 1)) + (m * ((i + 1) - 1))
  str += '.column-' + (i + 1) + ' {\n  width: ' + (cw.toFixed(6) - 0) + '%;\n}\n\n'
}

str += `
@media only screen and (max-width: 550px) {
  .column {
    width: auto;
    float: none;
  }
  .column + .column {
    margin-left: 0;
  }
}
`