Vanilla CSS-Grid Grid layout

A highly customizable grid layout based on the native CSS-Grid specifications.

Basic Q&A:

Q: What the heck is CSS-Grid?

A: Discover the basic concepts here (MDN)!

Q: What is available by default?

A: This library is fully working out-of-the-box and it ships with the Bootstrap 4 configuration (more here)!

Q: How could this help me?

A: Here some reasons:

• It's (hopefully) simple and straightforward
• It's based on native CSS specs created for the purpose === no CSS 'hacks' used!
• It's highly customizable. Need to change the breakpoints or the class-names? It's just a matter of seconds
• It's ultra-light-weight, just ~3KB (uncompressed)!
• It's just the good old grid, nothings else that you may not need ;)

show me the stuff

How-to customize:

• You can customize breakpoints, spacings, number of columns, class-names, and more!
• Just change the SASS configuration variables in the _grid.scss source file.

How-to import in your flow:

• Just add this to your main .SCSS file: @import /path/to/_grid.scss.

How-to compile standalone:

• Just run sass _grid.scss:grid.css in the file directory. (SASS CLI required, how to install SASS)
• If you don't need any additional change to the default configuration, just import the already-compiled grid.css file.