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.
See masonry.desandro.com for complete docs and demos.
Link directly to Masonry files on unpkg.
<!-- or -->
npm install masonry-layout --save
bower install masonry-layout --save
Support Masonry development
Masonry has been actively maintained and improved upon for 8 years, with 900 GitHub issues closed. Please consider supporting its development by purchasing a license for one of Metafizzy's commercial libraries.
// vanilla JS// init with elementvar grid = document;var msnry = grid// options...itemSelector: '.grid-item'columnWidth: 200;// init with selectorvar msnry = '.grid'// options...;
data-masonry attribute to your element. Options can be set in JSON in the value.
Masonry is released under the MIT license. Have at it.
Made by David DeSandro