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

Updated onApril 9, 2026By

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.
Table Of Content

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.

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

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

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.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
LinkedIn X GitHub YouTube Website
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What should I do if my Elementor icon list is not displaying correctly?

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.

What is the best layout option for an Elementor icon list on mobile devices?

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.

How do I customize the background of list items on hover in Elementor?

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. This feature allows you to enhance user interaction by changing the appearance of list items when hovered over, making your design more engaging.

Last reviewed: April 9, 2026

Related Docs