Flex One - 1 CSS Class System

.fluid {flex:1}

50%
50%
33,3%
33,3%
33,3%
25%
25%
25%
25%
20%
20%
20%
20%
20%
16,66%
16,66%
16,66%
16,66%
16,66%
16,66%
12,5%
12,5%
12,5%
12,5%
12,5%
12,5%
12,5%
12,5%

Flex One is Infinite Grid System based on the Flex CSS Layout

The layout is based on this class: .fluid {flex:1}

There are also the .main container class and the .clear class. And that is it.

Everything here was made with only 3 CSS classes. 

     
     // This is all the CSS:
     
     .main{display: flex; flex-flow: row wrap;  width: 80%; margin: 0 auto}

     .fluid{flex:1}

     .clear{width: 100%}
     
     

    // Just add any number of .fluid columns like this:

    // Two Columns

    <div class="fluid"></div>
    <div class="fluid"></div>
    <div class="clear"></div>

    // Three Columns

    <div class="fluid"></div>
    <div class="fluid"></div>
    <div class="fluid"></div>
    <div class="clear"></div>

    // Four Columns

    <div class="fluid"></div>
    <div class="fluid"></div>
    <div class="fluid"></div>
    <div class="fluid"></div>
    <div class="clear"></div>

Download on Github