← GitHub / Docs

vue-masonry-css example

A Vue masonry component powered by CSS to rendered fast, responsive and to be free of jQuery or other dependencies. Build specifically for Vue projects.

Item: {{index + 1}}


Dynamic Masonry Layout showing re-rendering:


Example with static HTML (see source):

My Element 1
My Element 2
My Element 3
With another line
My Element 4
My Element 5
My Element 6
My Element 7
My Element 8

Example with a mix of static HTML and dynamically rendered (see source):

Also, a smaller gutter size

My Element 1
My Element 2
Item: {{index + 1 + 2}}
My Element 6
My Element 7
My Element 8

Placeholder text and images rendered with Vue-Dummy