Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • February 27, 2014 at 9:09 am #229965
    tlow87

    How can I use an icon font (then Entypo checkmark for example) in an unordered list, wherein the items would be automatically indented.

    I’ve been currently pulling this off using shortcodes, but it’s a pain. I was thinking maybe a pseudo class could work, but I’m not sure how to specify the icon as the before content. Thanks for any help!

    February 27, 2014 at 10:05 am #229978
    Josue

    Hey!

    Try adding this code to the Quick CSS:

    .content ul li {
    list-style: none !important;
}
.content ul{
    padding: 0 !important;
}
.content ul li:before {
    content: "\2713";
    font-family: "entypo";
    margin-right: 5px;
}

    If you want to use another icon, refer to this character map:
    http://www.entypo.com/characters/

    Cheers!
    Josue

    July 10, 2014 at 11:59 am #289426
    Morticka

    Hi!

    I was looking for the same solution, so I used the code as well and styled it a little bit more:

    .content ul li:before {
    content: “\2713”;
    font-family: “entypo”;
    font-size: 2em;
    line-height: 1;
    margin-right: 10px;
    color: #94BD26;
    }

    All perfect, but then I scrolled down in my post and I saw this: https://dl.dropboxusercontent.com/u/13613026/List_SoMe_Icon.png

    Somewhere, something went wrong and I have no idea where!

    Can you help me?

    Sincerely,
    Morticka

    July 10, 2014 at 1:38 pm #289462
    Yigit

    Hi!

    Can you post the link to your page where we can see an example?

    Regards,
    Yigit

    July 10, 2014 at 4:09 pm #289565
    Morticka
    This reply has been marked as private.
    July 10, 2014 at 10:36 pm #289752
    Josue

    Hi!

    Try adding this too:

    .av-share-box li:before {
    content: "" !important;
    position: absolute !important;
}

    Cheers!
    Josue

    July 11, 2014 at 11:51 am #290001
    Morticka
    This reply has been marked as private.
    July 12, 2014 at 8:18 pm #290613
    Devin

    Hi!

    The syntax is just a bit off:

    
.av-share-box li:before {
content: '' !important;
position: absolute !important;
}

    Regards,
    Devin

    July 13, 2014 at 10:15 am #290762
    Morticka
    This reply has been marked as private.
    July 17, 2014 at 5:22 pm #292569
    Dude

    Hi!

    I’m not sure if I understand the problem but I think you want to remove the dash – ( & #8211; ) from the Tweet content? Keeping the dash directly is not possible because it’s not a valid url charachter and thus Enfold converts it to an entity which is & #8211;. You can try to use a minus ( – ) instead or replace the dash with another character.

    Regards,
    Peter

    July 18, 2014 at 12:02 pm #292908
    Morticka
    This reply has been marked as private.
  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Use Icon Font For Unordered List’ is closed to new replies.