What This CSS Code Does:
Aligns icons to the top of the list when a list item has several rows of content since the widget doesn’t have that setting.
Before:
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
After:
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
How To Implement:
Go to Advanced > Custom CSS of the text element and paste in the code bellow. If the icon appears to be a little off once aligned to the top, adjusting the line height of the content should do the trick.
The Code:
.elementor-widget .elementor-icon-list-item, .elementor-widget .elementor-icon-list-item a {
align-items: start;
}
