As I have worked on the web, I have always been fascinated with grid systems. While I have contributed to Neat and other libraries, they have never quite met my needs. More often than not, these libraries behave unpredictably, use things like nth-child
selectors, and dump huge amounts of unnecessary code to your library.
During my work, I realized that a clever application of calc
could be used to create a flexible and superior system with:
- low selector specificity and no
nth-child
selectors - gutters that could be defined in relative values like
2%
as well as fixed values like2rem
or16px
- simple and understandable codebase with a limited set of well focused features
- generate as little code as possible maintaining flexibility and not over restricting objects
- coexist seamlessly with flexbox objects and containers
- be compatible with both Lib Sass and Ruby Sass
With these core features in mind, I created Cask. It’s available on Rubygems, NPM, and Bower. For installation instructions check out the guides overs at cask.guide/docs/getting-started.
More at http://cask.guide. I really love this project and I hope you do too. 😘
section {
@include grid-column(8);
}
aside {
@include grid-column(4);
}