Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #395744

    Hi

    Elliot gave me some code for a custom icon-box which worked great but I cannot get it to work for an icon-list…. here is the code I used…I also changed the custom CSS as well

    .custom-iconlist .iconlist_icon.heading-color {
    background-image: url(https://.........mywebsite url.........)!important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    }
    .custom-iconlist .iconlist_icon.heading-color:before {
    display: none; 
    }

    What am I doing wrong?
    regards
    Richard

    #396227

    Hey Richard!

    Please always post a link to your website showing what you mean. What do you want to achieve exactly? Do you want to use a custom icon? if yes see this: http://kriesi.at/documentation/enfold/adding-your-own-icon-fonts/

    But I think you want to use a background image, right? You could try with something like this:

    .alternate_color .avia-icon-list .iconlist_icon {
    background-color: #d0d0d0;
    background: #d0d0d0 url('IMAGE URL HERE') no-repeat;
    }
    

    but I am not sure if it could work.
    If it does not I would suggest to hire a freelancer for this, because the icon list is meant to be an “icon” list and is not made for using any background images.

    Regards,
    Andy

    #396491

    Hi Andy
    It’s not the background that Elliot changed for me but the icon. And that worked fine on an iconbox but I cannot seem to get it to work on a iconlist. I wanted to place a custom icon in the list replacing the Fontello icons.

    This is the original code that Elliott gave me was to change the icon in the iconbox to a custom icon (not a fontello font) see code below:-

    .custom-iconbox .iconbox_icon.heading-color {
    background-image: url(https://.........mywebsite url.........)!important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    }
    .custom-iconbox .iconbox_icon.heading-color:before {
    display: none; 
    }

    I changed the iconbox to iconlist thinking that would change the icons in the iconlist as well but it didn’t.
    Where I am going wrong??
    Regards
    Richard

    #396941

    Hi!

    Try this out.

    .iconlist_icon [data-av_icon]:before { width: 30px; height: 30px; display: block; background: url("URL to your image"); content: ""; left: 25%; top: 25%; }
    

    And then play around with the width, height, top, and left values until it looks good.

    Best regards,
    Elliott

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.