How to Use Widget Equal Height

How to Use Widget Equal Height

As you can see in the title. You’ll get an idea of what is the documentation about. Most of the time, we are to go through the trouble of adjusting the equal height of the Widget or Column. A solution of one click is here. I’ll write about the solution below.

Note: Now, you can get equal height in terms of all of the widgets. For that, you should select the whole section and then go to the Advanced Tab > Equal Height.

Let’s dig in.

Widget Inserting and Equal Height

Here, I’ll insert a price table widget so that I can explain the whole thing. I’ll do all these things in bullets points. So, let’s start.

See the Price Table is not equal.
  • First of all, insert any widget( for example, Price Table widget) that require equal height.
  • Secondly, select the section hitting the edit section. After that, go to the Advanced Tab > Equal Height.
  • From the Equal Height section under the Advanced tab, you will find a switcher button named Enable Equal Height. Just, enable the button.
  • You can determine what things you want to bring under equal height. Simply click on the dropdown arrow from the Equal Height For and select any option.
See the Equal Height Price Table.

If you do all these things, you’re all set. Look at image above.

Equal Height: Equal Height For

Equal Height For will allow you to select what element you want to do equal height. See widget has held some contents that are in the individual div and the. In terms of that, you have to work with the widget and its child.

Note: If you want to use the Equal Height option, you will not be able to use that for multiple contents. For that, you can use the Custom Selector field.

As for example, I want to do equal height for the features list. This time widget and its child will not be perfect. So, you’ve to go for the Custom selector.

The custom selector will let you do equal height in accordance with the class name.

To select the class name, you’ve to go to the page > inspect > then select and copy the class name > finally paste in the Custom Selector field. See the image example below.

Note: I want you to share a thought. Whatever changes you do in the editor panel. No matter. Hit the preview changes and see the output.

Video Assist

Finally, if you read this doc, you can see how to use equal height. Hopefully, you are clear that two things work for equal height.

  • Widget and its child
  • Custom Selector and Class Name.

In case, you feel you need more support, you can watch the video inserted above. Thanks a lot.

About Selim Rana

Selim Rana is the Founder of BdThemes - the company behind Element Pack Pro! He is a Software Engineer passionate about WordPress and Elementor.

A first-ever all-in-one web solution with essential widget, extensions, and features for Elementor WordPress.

Your complete web development partner.


Copyright © 2022 BdThemes.
All Rights Reserved. Site built with Element Pack & Rooten Theme.

AUTUMN Sales up to 60% Discount on our products | Coupon: AUTUMN

Ready to buy Element Pack Pro?

Don’t miss 230+ essential Elementor widgets and 2000+ ready templates for professional web design.

Changed your Mind?

Please Suggest us how to improve

Up to 60% OFF

Purchase all our add-ons and make your website better than ever with our web designing products. Make your purchase with our limited-time AUTUMN offer in 60% off.