Masonry
Cascading grid layout library
Masonry works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet.
For complete docs and demos, see masonry.desandro.com or masonryjs.com if you're lazy,
Install
A packaged source file includes everything you need to use Masonry.
Bower
If you are cool with the command line, install Masonry as a Bower package:
bower install masonry
Initialize
In JavaScript
var container = document;var msnry = container// options...itemSelector: '.item'columnWidth: 200;
In HTML
Add a class of js-masonry
to your element. Options can be set in JSON in data-masonry-options
.
...
License
Masonry is released under the MIT license. Have at it.
Copyright ©️ 2014 David DeSandro