60 Columns Grid System

Experimental CSS Grid Layout.

60 GS is starter kit for the CSS Grid.
1
2
1
2
3
1
2
3
5
1
2
3
4
5
1
2
3
4
5
6
Why 60?

Because the number 60 is dividable by 2,3,4,5 and 6.

Lightweight - 1 CSS class
1-60 columns
It can be Fluid or Responsive

        No joke, It is just one CSS class:

        .grid {
          display: grid;
          grid-template-columns: repeat(60, 1fr)
        }

        This is it! Everything else is optional.
      

        You can some extra features like:

        .col-60 { grid-column-end: span 60 } /* 1 column */
        .col-30 { grid-column-end: span 30 } /* 2 columns */
        .col-20 { grid-column-end: span 20 } /* 3 columns */
        .col-15 { grid-column-end: span 15 } /* 4 columns */
        .col-12 { grid-column-end: span 12 } /* 5 columns */
        .col-10 { grid-column-end: span 10 } /* 6 columns */

        You don't need to use this.
Why do you need this grid system? Bescouse is hard to have 2,3,4,5,6 columns under the same display: grid;
Custom1
Custom2
Custom3
Learn more on Github