---
title: "How to Create Responsive Horizontal/Vertical Layout for Elementor Icon List?"
url: https://theplusaddons.com/docs/create-responsive-horizontal-vertical-layout-for-elementor-icon-list/
date: 2024-03-30
modified: 2026-04-09
author: "Aditya Sharma"
description: "Do you want to create a responsive Elementor icon list? Having a responsive Elementor icon list that can automatically adapt to different screen sizes can improve the user experience. With..."
word_count: 204
---

# How to Create Responsive Horizontal/Vertical Layout for Elementor Icon List?

## Key Takeaways

- Style Lists widget from The Plus Addons for Elementor allows users to create a responsive icon list.
- Users can set the icon list layout to either vertical or horizontal using the Desktop Layout dropdown.
- The Style Lists widget adapts layouts for different devices, including Desktop, Tablet, and Mobile.

Do you want to create a responsive Elementor icon list? Having a responsive Elementor icon list that can automatically adapt to different screen sizes can improve the user experience.

With the Style Lists widget from The Plus Addons for Elementor, you can easily create a responsive Elementor icon list.

*To check the complete feature overview documentation of The Plus Addons for Elementor Style Lists widget, [click here.](https://theplusaddons.com/docs//style-lists-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/elementor-stylish-list/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do this, add the Style Lists widget to the page and follow the steps - 

1. Add the icon list content from the **Stylish List** tab.

2. Then go to the **Extra Options** tab, then select the appropriate device tab (Desktop, Tablet or Mobile) and set the icon list layout from the **Desktop Layout** dropdown. Here you’ll find two options - 

- **Default** - To set a vertical layout.

- **Horizontal** - To set a horizontal layout.

![Horizonta and Vertical Layout for Elementor Icon List](https://theplusaddons.com/wp-content/uploads/2024/03/Horizonta-and-Vertical-Layout-for-Elementor-Icon-List.gif)

Following this process, you can set different layouts for different devices.

This is how easily you can make an Elementor icon list responsive.

***Suggested Read**: [How to Change Elementor List Item Background on Hover.](https://theplusaddons.com/docs//change-elementor-list-item-background-on-hover/)*

## Frequently Asked Questions

**Q: What should I do if my Elementor icon list is not displaying correctly?**
A: If your Elementor icon list isn't displaying correctly, ensure that you have installed and activated The Plus Addons for Elementor, as the Style Lists widget is part of this plugin. Additionally, check that you have correctly selected the layout for the appropriate device tab (Desktop, Tablet, or Mobile) in the Extra Options tab. This can often resolve display issues.

**Q: What is the best layout option for an Elementor icon list on mobile devices?**
A: For mobile devices, a vertical layout is typically the best option for an Elementor icon list. This layout allows for easier scrolling and better readability on smaller screens. You can set this layout by selecting the Mobile tab in the Extra Options and choosing 'Default' from the Desktop Layout dropdown.

**Q: How do I customize the background of list items on hover in Elementor?**
A: To customize the background of list items on hover in Elementor, refer to the tutorial on [How to Change Elementor List Item Background on Hover](https://theplusaddons.com/docs//change-elementor-list-item-background-on-hover/). This feature allows you to enhance user interaction by changing the appearance of list items when hovered over, making your design more engaging.
