@juiceboxes/juice-grid/juice-grid.min.css

A lightweight, simple, grid system using CSS Grid OR flexbox

.grid .row:last-of-type,.grid-flex .row:last-of-type{margin-bottom:15px}.grid .row>*,.grid-flex .row>*{display:block;padding:10px}.grid{display:grid;margin:0 auto}.grid.with-gutters{grid-gap:15px}.grid .row{display:grid;grid-template-columns:repeat(12,1fr);grid-gap:15px}.grid .push-1{grid-column-start:2}.grid .col-1{grid-column-end:span 1}.grid .push-2{grid-column-start:3}.grid .col-2{grid-column-end:span 2}.grid .push-3{grid-column-start:4}.grid .col-3{grid-column-end:span 3}.grid .push-4{grid-column-start:5}.grid .col-4{grid-column-end:span 4}.grid .push-5{grid-column-start:6}.grid .col-5{grid-column-end:span 5}.grid .push-6{grid-column-start:7}.grid .col-6{grid-column-end:span 6}.grid .push-7{grid-column-start:8}.grid .col-7{grid-column-end:span 7}.grid .push-8{grid-column-start:9}.grid .col-8{grid-column-end:span 8}.grid .push-9{grid-column-start:10}.grid .col-9{grid-column-end:span 9}.grid .push-10{grid-column-start:11}.grid .col-10{grid-column-end:span 10}.grid .push-11{grid-column-start:12}.grid .col-11{grid-column-end:span 11}.grid .push-12{grid-column-start:13}.grid .col-12{grid-column-end:span 12}.grid-flex.with-gutters .col+.col{margin-left:15px}.grid-flex .row{display:flex;width:100%}.grid-flex .row .col{flex-basis:0;flex-grow:1;flex-shrink:1}