List with a icon of the theme instead the standard bullet point

As an image worth more than thousand words:

list-style-type seems the property in CSS to do it in a “normal” way (it modify the default bullet point icon by another one: https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type

However, I don’t think CSS allows the icon shortcodes: http://demo.theme.co/integrity-1/shortcodes/icons/

I have also tried to find a way to create a list “manually”, adding margins, but I’ve not found a way so far…

Any idea?

Thanks

Carlos

I’ve found a solution a few minutes after asking!!!

HTML:

<p class="my-list">
<span>[x_icon type="check"] </span>kasdfasflksdfk askdfa sf skfj k
<br />
<span>[x_icon type="check"] </span>kasdfasflksdfk askdfa sf skfj k
cc</p>

CSS:

.my-list{
  padding-left:30px;
  
}
.my-list span{
 margin-left:-25px;
margin-right:-5px;
}
1 Like

Glad to hear you got it sorted and thanks for sharing the solution. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.