This is a handy, pixel based, percentage output, grid column generator. It works great when working with flexbox, Genesis post class columns, or any other scenario that you may want to define your container width, total columns, and gutter (space between the columns). It's a pretty useful tool that doesn't need much introduction. Major props to Marcy Diaz for schooling me on the math formula to get this working. Bookmark this post and use it as you need. Enjoy!
Column Count | Width |
---|---|
1⁄12 | 6.8055555555556% |
2⁄12 | 15.277777777778% |
3⁄12 | 23.75% |
4⁄12 | 32.222222222222% |
5⁄12 | 40.694444444444% |
6⁄12 | 49.166666666667% |
7⁄12 | 57.638888888889% |
8⁄12 | 66.111111111111% |
9⁄12 | 74.583333333333% |
10⁄12 | 83.055555555556% |
11⁄12 | 91.527777777778% |
12⁄12 | 100% |
Shaan Nicol says
Awesome, thanks Mike
JiveDig says
No prob. Def a useful tool!
Jess says
thank you for this awesome tool, still being used in 2021