A CSS grid framework using Flexbox.

• Simple: Provides just 2 base classes Grid and Cell and some modifiers.
• Light-weight: Only 512 bytes (Gzipped).
• Flexible: Easy to use Flexbox features.

Flexible Box Layout Module and calc() as CSS unit value used in Grd are available on modern browsers (Chrome, Firefox, Safari, Opera, Edge and IE11).

Installation

# via npm
$ npm install grd

# via bower
$ bower install grd

Usage

<div class="Grid">
  <div class="Cell -3of12">3of12</div>
  <div class="Cell -9of12">9of12</div>
</div>

Live Demo