responsive-image-grid v0.0.4

image-grid

image-grid is a mobile friendly responsive grid optimized for three different image formats. It is build with a subset of the awesome spectre.css and uses its responsive grid customized to work well with image ratios of 2/3, 3/4 and 1/1.

Demo

• analog-format 2/3
• digital-format 3/4
• square-format 1/1

Installation

Install manually

Download the compiled and minified CSS file

Install wit NPM

$ npm install responsive-image-grid

And include it in your site.

<link rel="stylesheet" href="dist/image-grid.min.css" />

Usage

Images should have the correct ratio in landscape or portrait orientation. Have a look at the files in the demo directory to see how to use the grids. To adjust the padding change the @image-gutter variable in variables.less. Then compile the css with gulp build.

License

MIT