Docs

[Antoine]

I’ve got a problem with the spacing in an icon list. I’d like to:

1. Reduce the spacing between the lines of a same icon item list
2. Align the different lines (there is a small spacing at the moment)

See the screenshot for more details:

How to do the change?
Thanks for your help!

[Lely]

Hello Antoine,

Thanks for giving us the screenshot with clear information of what you want to achieve here. please add the following code in your Customizer via Appearance > Customize > Custom > CSS:

#x-content-band-1 .x-ul-icons li {
line-height: 1;
margin-bottom: 20px;
}

Hope this helps.
Thanks.

[Antoine]

Thanks so much for the really fast response!

The CSS solves the spacing between the lines (in red on my screenshot) but doesn’t solve the alignment at the beginning of the lines (in blue in my screenshot).

Do you have another solution?

[Lely]

Hello Antoine,

Please also add the following CSS:

#x-content-band-1 .x-ul-icons li .x-icon-check{
  margin-left: -10px;
  margin-right: 10px;
}
#x-content-band-1 .x-ul-icons li span{
  margin-left: -13px;
}

Hope this helps.
Thanks.

[Antoine]

It works like a charm. Thank you so much, your support is amazing!

[Friech]

Glad we could help, Cheers!

[Antoine]

I am trying to do some Icon lists with different icons but the spacing between the icons and the words and the alignment of the icons doesn’t work :it works actually fine when I use only the “ckeck” icon, but I’d like to be able to use different icons. Here it how it looks like:

What should I change to make it work?

URL: http://www.paleoflaneur.com/discover-paleo/get-started-today/

[Thai]

Hi There,
Please try adding following CSS:

#x-content-band-1 .x-ul-icons li i{
  margin-left: -10px;
  margin-right: 10px;
}

Hope it helps.

[Antoine]

It works like a charm. Thanks.

[Christian]

You’re welcome. Glad we could help.

[Antoine]

EDIT: I managed to solve the problem I had.

[Lely]

Glad that you figure it out.
Let us know if you have questions in the future.

[Author]

Posts