Icon List Spacing – Themeco Community

Icon List Spacing

Antoine — Sat, 09 May 2015 03:57:17 +0000

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!

Reply To: Icon List Spacing

Lely — Sat, 09 May 2015 04:12:11 +0000

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.

Reply To: Icon List Spacing

Antoine — Sat, 09 May 2015 04:17:32 +0000

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?

Reply To: Icon List Spacing

Lely — Sat, 09 May 2015 04:53:09 +0000

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.

Reply To: Icon List Spacing

Antoine — Sat, 09 May 2015 05:37:50 +0000

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

Reply To: Icon List Spacing

Friech — Sat, 09 May 2015 05:47:23 +0000

Glad we could help, Cheers!

Reply To: Icon List Spacing

Antoine — Wed, 27 May 2015 11:36:48 +0000

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/

Reply To: Icon List Spacing

Thai — Wed, 27 May 2015 11:56:32 +0000

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.

Reply To: Icon List Spacing

Antoine — Wed, 27 May 2015 23:46:36 +0000

It works like a charm. Thanks.

Reply To: Icon List Spacing

Christian — Thu, 28 May 2015 02:53:20 +0000

You’re welcome. Glad we could help.