When diagramming for the web, one of the most useful ways of doing it is through grid systems to help the designer layout faster. Today we found a nice percentage based grid system that is nested in the Easy framework’s CSS.

This grid system features a percentage-based width in all its columns to make them adjust to the container element, which means that by using this system you will not have to set the width value for every column manually, just put it inside any container and both the column widths and gutters will be adjust perfectly.

The system can take up to 6 equal width columns, giving you the opportunity to choose from 2 to 6 columns in the set. You can have double, triple and up to quintuple columns per each column set, so given the case you have different column sets in one single container you will have equal gutters.

The article explains how to properly name the columns and containers, edit the column padding and also features the following demos:

• 2, 3 and 4 columns demo – fixed width
• 5 columns demo – fixed width
• 6 columns demo – fixed width
• 2, 3 and 4 columns demo – fluid width
• 5 columns demo – fluid width
• 6 columns demo – fluid width

Visit the Original link