Emerald v1.2.0

lmc-eu.github.io/emerald/

Emerald is a pragmatic responsive grid system in LESS

Responsive
OOCSS
BEM sytax
Nestable
Mobile-first
Tablet-come-from
Block-element based
(= no floats, clears or rows)
Configurable
1.2 kB (minified and gzipped)

How to use

Install via Bower

$ bower install emerald

Either include source LESS files into your project (recommended) or use compiled CSS.

// main.less
@import "emerald/less/emerald";

Browser support

Emerald grid system is tested in the latest versions of the major browsers on the major desktop and mobile platforms.

Support for `vw` units

Android browser does not support vw units. Load emerald.js at the bottom of the page:

<script src="js/emerald.js"></script>

Internet Explorer 8

Legacy browser are supported by grunt-legacssy.

The name

Please note that the name Emerald does not refer to the gemstone of that name but to a diamond cut "originally developed for the cutting of emeralds."

Does it really matter? No.

Credit

This grid system was inspired by:

Changelog

v1.2.0 Code refactoring, fix typos, remove legacy and minimised CSSs
v1.1.3 Fix a bug with .e-0 classes overwriting on higher devices
v1.1.2 Fix a printing problem in FF
v1.1.1 Hiding .grid__item in print
v1.1.0 Add print styles (fixes #6)
v1.0.0 Initial release, production ready

cloozis/emerald