How to Use Equal Height Feature in Elementor

When you are creating columns side by side for a website, it should have the same height, otherwise, the whole design will look odd. This can be solved with the proper HTML code. But how will a non-technical person handle this situation?

Well, HappyAddons has launched an incredible feature for non-technical Elementor users. From now, you can add and adjust the equal height in your Elementor powered websites without a single line of code. 

HappyAddons Equal Height Feature is free, and it assists the Elementor users to set up the column heights the same. So, make your website design flawless by following our step by step instructions right below. 

Is Equal Height Really That Necessary?

During design a website you may often notice that some of the columns or widgets don’t have equal height. The length basically depends on the content it contains. Have a look at the above image carefully.

At a first glance, can you like the left image? We can predict, no! And just like you, most people will feel awkward. On the other hand, the right side image looks better and pretty organized.

So you can easily understand how much important Equal height is for your website. Well, the Equal Height feature from HappyAddons can help you to manage the heights of all widgets while working inside Elementor.

How to Use HappyAddons Equal Height Feature

This new feature works seamlessly with all Elementor widgets. You can also apply this feature on other third-party addons’ widgets as well.

Let’s show you the setup process for the Elementor widget & HappyAddons widget separately.

1. Using Equal Height with an Elementor Widget
2. Using Equal Height with a HappyAddons Widget

Let’s dive into the details.

1- Using Equal Height with An Elementor Widget

To get this feature you need the following pre-requisites-

• A WordPress Site
• Elementor 
• HappyAddons – A Elementor Addons (Free)

Here, we’ve selected the Price Table widget from Elementor to show you the whole procedure.  

Now, configure the widget according to your requirements. Add the texts, prices, ribbons, and other detailed information. Information in each section may not match and thus, you will notice that the length of the Price Table widget is not evenly in the same section. 

Next, click on Edit Section from the menu bar. 

After that, go to the Advanced section. You will get the Equal Height option there, enable it, and see the magic. 

Next, choose the widget from the selected section. Here, you can disable the Tablet and Mobile mode.

Finally, select the margin and you will see that the widgets now have equal heights.

Here we have chosen 100px for margins. 

Well, look carefully- we include different level of content into each column of the Price Table. But using equal height feature of HappyAddons we give it a better look by equalizing the height of all columns.

2- Using Equal Height with A HappyAddons Widget

Let’s apply this feature on a third party Elementor addons- HappyAddons widget.

Firstly, select a Happy widget from the Menu Bar. We have chosen the Card widget, to display the whole process of adjusting the height.  

Now customize the widget as you need. You can add images, texts, and other designs. Data from each part may not match. That’s why you will notice that the length of the widgets is not the same in the same section. 

We will now fix the length of each section equally. For that, you have to click on Edit Section from the menu bar. 

Then go to the Advanced section, you’ll find the Equal Height option there. Now just enable it. 

As we showed above from this option you can disable the tablet and mobile mode.

Tada! Select the height as per your needs and see the final output!

If you want to see the process in motion check the video below-

Have You Successfully Done It?

As you can see, the Equal Height feature can bring a sharp look to your website. It was quite hard for Elementor users to edit the heights of any design.  

If you couldn’t make the same height with this feature or it bloats your site or whatsoever, feel free to knock us in the comment section below.

Let us know what type of features you need to beautify your website. Apart from that, you can check the details of each HappyAddons widget.

Have a great day!