Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • May 21, 2016 at 6:37 am #636142
    Eliseleb

    I have been struggling with icons. i want to be able to add inline styles to icons in text boxes.

    Here is the avia code example

    [av_font_icon icon=’ue806′ font=’entypo-fontello’ style=’line-height:70px;padding:30px’ caption=” link=” linktarget=” size=’40px’ position=’left’ color=”]

    and this is what comes out in html

    <span class=”av-icon-char” style=”font-size:40px;line-height:40px;width:40px;” aria-hidden=”true” data-av_icon=”?” data-av_iconfont=”entypo-fontello”></span>

    Is the style element not working on the icons? Is there a trick to make it work?

    Thanks

    May 23, 2016 at 6:09 am #636545
    Rikard

    Hi Eliseleb,

    Could you provide us with a link to the site in question so that we can take a closer look please?

    Regards,
    Rikard

    May 24, 2016 at 5:51 am #637259
    Eliseleb

    Sure, here’s a test page demonstrating the problem.

    May 24, 2016 at 6:19 am #637267
    Basilis

    Hi!

    The shortcode can not have a style attribute, as it is not prebuild, that is why you might see the result, but hey do not get applied. They can not get executed.
    Each shortcode has a certain ID / Class only for him so you should use that to style the element.

    Regards,
    Basilis

    May 24, 2016 at 6:23 am #637270
    Eliseleb

    Well, it’s a bummer that the attribute is there but I can’t use it. I have looked and looked in the Chrome Developer view but I cannot find a way to uniquely identify various icons on the same page. Applying CSS style changes ALL of them. How can I just grab one icon on the page?

    May 24, 2016 at 6:24 am #637271
    Eliseleb

    I am also happy to use the icon without the shortcode (I work in the text view 90% of the time). If you can show me how to do that, it might be easier. But I struggled with the damn unicode and could not get that to work either.

    • This reply was modified 8 years, 7 months ago by Eliseleb.
    May 24, 2016 at 5:01 pm #637624
    Yigit

    Hi,

    Please enable the custom css class field: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and then edit your element and give it a custom CSS class and then add following code to Quick CSS in Enfold theme options under General Styling tab

    .your-custom-class span.av-icon-char { color:red;line-height:70px;padding:30px; }

    Best regards,
    Yigit

    May 24, 2016 at 5:22 pm #637638
    Eliseleb

    THANK YOU! I didn’t know this feature and it’s exactly what I needed.

    May 24, 2016 at 5:27 pm #637641
    Yigit

    Hi!

    You are welcome!
    For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
    And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)

    Cheers!
    Yigit

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘fontello icon style is not working’ is closed to new replies.