Minigrid

Minigrid

Minimal 2kb zero dependency cascading grid layout without pain.

Star

Demo

There's a simple example on jsbin.

Usage

It works on a grid container with a group of grid items.

<div class="cards">
  <div class="card"></div>
  <div class="card"></div>
  <div class="card"></div>
</div>

Then:

var grid = new Minigrid({
  container: '.cards',
  item: '.card',
  gutter: 6
});
grid.mount();

Installation

Get it from npm.

npm install minigrid

Or 1998 script tag from unpkg:

<script src="https://unpkg.com/minigrid@3.1.1/dist/minigrid.min.js"></script>

Upgrade

Upgrading from v1.x or v2.x?

Please read the CHANGELOG for API changes.

Limitations

Minigrid was built having in mind "cards" with same width and different heights. If your cards have different width sizes or you need more power I would recommend Isotope.

Questions

Open an issue or hit me on Twitter.