How Can I Make A Semantic Grid System with Bourbon & Neat?

I’ve used Bourbon and Neat on a couple projects recently and have found the Neat grid to be simple and easy to use. These are a few of the things I particularly like about it:

Rows are determined with styles instead of extra divs which makes it flexible and easy to work with

Because it doesn’t rely on classes in the html, it’s easy to define different column counts at different breakpoints

It’s easy to create nested grids with consistent gutter widths

The built-in visual grid overlay for development is easy to toggle on and off

There are several add-on libraries based on Bourbon and Neat. For example, http://empties.bourbon.io is a library of un-styled components that give you just enough html and javascript to get started quickly