To achieve equal column height, we suggest using an element we developed called Elements Holder.
One of the settings available from Elements Holder’s set of options is choosing a number of columns.
To illustrate this example, we’ll use 2 columns.
Therefore, 2 Elements Holder Items need to be added.
There are also options for both vertical and horizontal alignment.
Element Holder Items can contain various elements, but they can also be left empty, in which case only the background image is most commonly added, for styling purposes.
Additional adjustments can be done using all the options available within the element, especially using the padding and background color settings.
Padding is inserted by adding 4 values, which are padding-top, padding-right, padding-bottom and padding-left, in that specific order.
Looking at the screenshot, padding-top is 200px, padding-right is 50px, padding-bottom is 200px and padding-left is 50px.
If you wish to learn more about padding, you might find this article useful.
On top of all this, Elements Holder Items have padding adjustment settings for various different screen sizes as well.
Here’s an example of a simple layout you can create this way, with added steps on how to achieve this:
1st column settings:
2nd column settings:
Video Tutorial