Katana is CSS Layout System made with Flexbox
Minimal flexbox system for making HTML layouts.
- Minimal. It only 20 lines of .scss.
- Clear syntax.
- Responsive.
- Fluid column.
- Anything can be personalised.
Katana default values:
- 12 columns
- 15 px grid margin
- 94% main grid size
Basically you can generate any grid with any value or unit you like just change the default numbers in the katana.scss.
https://vladocar.github.io/Katana/
also:
The class names are col-1, col-2 ..
The width value of col-1 is 100%, the value of col-3 is 100/3 = 33,33%, col-5 is 100/5 = 20%.
You also have .fluid column. You can use multiple columns in one row.
You can simply download the library or use:
$ npm i katana.scss
Works in all flex compatible browsers
This project is licensed under the MIT License