This is a way to add images with a caption. The images have all the same width, and the height is regulated by the code.
Images and caption are popped into a container, here .masonry-item, and then all those containers are placed in a column in the .masonry-container. The Multiple Columns feature has been used to form the display.
Please note the small piece of styling in the Element pane, it is to prevent that an image 'breaks in two' when a new column is created. You won't see it while working in SD, but the effect kicks in when previewing.
It is a good thing to think about balancing the column height, so you may want to move your images around a bit.
Masonry CSS Image Gallery
This is a way to add images with a caption. The images have all the same width, and the height is regulated by the code.
Images and caption are popped into a container, here .masonry-item, and then all those containers are placed in a column in the .masonry-container. The Multiple Columns feature has been used to form the display.
Please note the small piece of styling in the Element pane, it is to prevent that an image 'breaks in two' when a new column is created. You won't see it while working in SD, but the effect kicks in when previewing.
It is a good thing to think about balancing the column height, so you may want to move your images around a bit.
Download this component