Grid, Masonry, Justify and List layouts

Updated on June 18, 2019

What’s the differences between Elementor’s widgets layouts?

You can assign different layouts to the Elementor’s widgets which can display multiple items with image like Images LayoutPosts or Photo Album.

Layout Elements Jupiter X

Beware! 
Posts 
and Photo Album are part of the Raven elements. Raven is an exclusive plugin developed by Artbees which represents new useful elements to Elementor.
Images layout is part of the JetElementsJetElements is an add ons for Elementor page builder which provides a set of +50 new useful widgets for the Elementor.


There are four types of layouts you can use for your widgets. GridMasonryJustifyand List.

Layout Settings Jupiter X

Some of the Elementor’s widgets like Images Layout have all four types of layouts, but some of them have fewer layouts (i.e: Posts and Photo Album)

In the following article we will shed light on the features of every layout:

Grid layout

By choosing this layout, all of the items will have the same width and the same height as well. If the items are not the same size, they will be cropped. You can also define the number of columns for this layout.

Screenshot Grid Layout

Masonry
In this layout all of the items have the same width but height of each, will be different. you can define the number of columns for this layout.

Screenshot Masonry Layout

Justify
This layout is the opposite of Masonry layout. In other words all of the items with Justify layout will have the same height but different width. You can set a height for the items in Justify layout. 
Justify layout consider the aspect ratio for each item, so that by changing the height of items, you may experience a different look for this layout.
Here are some example of Justify layout. All of the examples have similar items but in different heights:

Justify 2
justify 3

List
This layout just lists all of the items vertically with the same width. The width and height of the items will be automatically defined in List layout and users have no control of them.

List Layout
Did this answer your question?