Ignati [dot] com

I’m sure if any web designer already close to div layout where as floats arrange elements horizontally then vertically using css. But how about arranges elements vertically then horizontally like above image? Then you should try jQuery Masonry, a layout plugin from jQuery javascript framework. The result leaves no vertical gaps between elements of varying height, just like a mason fitting stones in a wall.

No setting or options needed with this plugin. Instead, all spacing properties can be set with CSS. The only requirement for Masonry to work is for the width of the child elements since child elements should be should have equal width in order to avoid any overlapping on your layout.

Work with all structural elements such as div’s, lists, p’s, spans but only child elements are affected, not all descendants.

Tags: css, javascript, jquery, layout, plugin

If you like this post then please consider to subscribe my feed. You can also have new post directly to your inbox if you prefer subscribe by email.