gee

gee is a percentage-based grid system defaulting to 12 columns. It can be either used in a semantic way by using LESS mixins or in a traditional class-based (unsemantic) way.

The basic components are "grids" and "units" where a grid contains one or more units. The only requirement is that all units are children of a grid.

@import 'gee.less';

/* Semantic grid */
.container {
    .gee-grid();
}
.main {
    .gee-unit(9);
}
.sidebar {
    .gee-unit(3);
}

/* Generate class-based (unsemantic) grid */
.gee-generate(12, 0, gee-);