Masonry

Arranges elements vertically in the next open spot, minimizing vertical gaps between elements of varying height.

Made by David DeSandro

  • Developer Tools

  • jquery-plugin

  • CSS / Stylesheets

What is Masonry?

Masonry is a dynamic grid layout plugin designed for jQuery. It functions as an alternative to CSS floats, arranging elements vertically rather than horizontally. Unlike floating, Masonry positions each element in the next available spot within the grid, minimizing vertical gaps between components of varying heights, much like a mason arranging stones in a wall. This approach creates a visually cohesive and dynamic layout, optimizing the use of available space on the page

Highlights

  • Vertical grid layout that automatically adjusts to element heights
  • Efficient use of page space by filling gaps between elements
  • Flexible implementation with jQuery for dynamic, responsive designs
  • Customizable grid configurations and element positioning

Platforms

  • Mac
  • Linux
  • jQuery
  • Windows

Languages

  • English