---
title: "How to Add Multiple Elements Inside One Element in Elementor Hover Card?"
url: https://theplusaddons.com/docs/add-multiple-elements-inside-one-element-in-elementor-hover-card/
date: 2023-07-04
modified: 2026-04-11
author: "Aditya Sharma"
description: "With the Hover Card widget from The Plus Addons for Elementor, you can easily create complex layouts by adding multiple elements inside one element. Seamlessly combine images, text, buttons, and..."
image: https://theplusaddons.com/wp-content/uploads/2023/07/How-to-Add-Multiple-Elements-Inside-One-Element-in-Elementor-Hover-Card_-1024x536.jpg
word_count: 402
---

# How to Add Multiple Elements Inside One Element in Elementor Hover Card?

## Key Takeaways

- The Plus Addons for Elementor Hover Card widget allows users to create complex layouts by adding multiple elements inside one element.
- Users can add images and text content inside a container by selecting appropriate tags from the Open Tag dropdown.
- Knowledge of HTML nested elements is required to create complex layouts using the Hover Card widget.

With the Hover Card widget from The Plus Addons for Elementor, you can easily create complex layouts by adding multiple elements inside one element. Seamlessly combine images, text, buttons, and more to create captivating designs that grab attention and enhance user engagement.

*To check the complete feature overview documentation of The Plus Addons for Elementor Hover Card widget, [click here](/docs/hover-card-elementor-widget-settings-overview/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/advanced-elementor-hover-card/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do so, add the Hover Card widget on the page and click the **+ADD ITEM** button to add an item.

To create the container which will contain other elements, select the appropriate option from the **Open Tag** dropdown, ideally choose **Div**. 

If you want, you can add a class name in the **Enter Class** field.

Then set **None** as the **Close Tag**. So the tag will remain open.

> *Note: You must have knowledge of HTML nested elements to create complex layouts.*

In the **Content,** ideally you should select **None** because it is a container.

Now whichever element you add before closing the previous tag will be placed inside the container.

Let’s add an image and text content inside the container.

Click on the **+ADD ITEM** button to add an item and select **None** from the **Open Tag** dropdown if you don’t want to wrap the image inside any other tag, or you can select any appropriate tag you want. 

If you want, you can add a class name in the **Enter Class** field.

Then set **None** as the **Close Tag**, but if you have selected any other tag as the opening tag, select **Default** as the **Close Tag**.

From the **Content** dropdown, select **Image**.

Follow the same process to add Text content.

Once done, click on the **+ADD ITEM** button to add another item to close the container.

To do so, in the **Open Tag,** select **None** and **Div **or the tag you’ve used to open the container as the **Close Tag**, this will close the previously opened tag.

Set **None** in the **Content** dropdown as well.

![hover card nested element structure](https://theplusaddons.com/wp-content/uploads/2023/07/hover-card-nested-element-structure.gif)

Now, the image and text content is inside a div. You can use the browser inspect element to check the structure.

Following this process you can create complex layouts using nested elements.

![hover card nested element inspect element](https://theplusaddons.com/wp-content/uploads/2023/07/hover-card-nested-element-inspect-element.gif)

Also, read [How to Add Hover Effect With Custom Hover Class in Elementor Hover Card](https://theplusaddons.com/docs//add-hover-effect-with-custom-hover-class-in-elementor-hover-card/).

## Frequently Asked Questions

**Q: What should I do if the Hover Card widget isn't displaying correctly?**
A: If the Hover Card widget isn't displaying as expected, ensure that The Plus Addons for Elementor is installed and activated. Additionally, verify that you have selected the correct Open Tag option, ideally 'Div', to create a proper container for your elements. If issues persist, check for any conflicting CSS that might be affecting the layout.

**Q: What is the best practice for setting the Close Tag when adding elements?**
A: When adding elements inside the Hover Card widget, set the Close Tag to 'None' for the container and use the same tag as the Close Tag that you used to open the container. This ensures that your nested elements are properly structured and displayed within the intended container.

**Q: How do I ensure the elements inside the Hover Card are properly nested?**
A: To ensure proper nesting of elements inside the Hover Card, select 'None' in the Content dropdown for the container and add elements before closing the tag. This way, any element you add will be placed inside the container, maintaining the desired layout structure.