Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • August 21, 2013 at 7:54 pm #28210
    Valerie

    Two issues using Avia layout builder (which I love BTW, so convenient, many thanks):

    1. The font color in the text block element is a different color from the text color in the icon list and rest of the site. No color html present in the elements.

    2. Bullets don’t display in an icon list text. In the List Item Content window for an icon list element, I formatted the text to have bullets, which appear in the List Item Content box in visual mode and show as an undefined list in text mode.

    See http://talentdev.valiantlane.com/resources.

    Can you assist in resolving these issues?

    Valerie

    August 22, 2013 at 5:12 am #136853
    Ismael

    Hi,

    1.) You can change the color of the text black font using this:

    .avia_textblock p {
    
color: blue;
    
}

    or this:

    .main_color p {
    
color: red;
    
}

    2.) Use this to show the bullets on list elements:

    .avia-icon-list li {
    
margin: 0;
    
padding: 0 0 30px 0;
    
list-style-type: circle !important;
    
list-style-position: outside;
    
clear: both;
    
overflow: visible;
    
position: relative;
    
min-height: 60px;
    
}

    Regards,

    Ismael

    August 22, 2013 at 2:56 pm #136854
    Valerie

    Hi Ismael,

    Thanks for the fixes. The font fix worked; the bullet fix didn’t. The code for the bullets places a bullet outside the icon image as well as in the icon element text. See http://talentdev.valiantlane.com/resources.

    The only place I want the bullets is inside the text for the icon element. I want only the icon next to the icon element title. How would I do that?

    Valerie

    August 23, 2013 at 2:32 am #136855
    Ismael

    Hey,

    Can you give me a screenshot? I thought this is what you want.

    Regards,

    Ismael

    August 23, 2013 at 2:40 pm #136856
    Valerie

    Hi..What I am seeing is a circle to the left of the icon image: http://talentdev.valiantlane.com/wp-content/uploads/2013/08/bulletissue.png

    I have cleared cache several times and still see it.

    Thanks for your very thorough help!

    August 24, 2013 at 3:37 am #136857
    Ismael

    Hey,

    I really don’t see it. What browser are you using?

    Please add this on your custom.css or Quick CSS:

    .entry-content ul li.avia_start_animation {
    
list-style: none;
    
}
    

    
.entry-content ul li.avia_start_animation {
    
list-style: disc inside;
    
}

    Regards,

    Ismael

    August 24, 2013 at 4:02 pm #136858
    Valerie

    I believe you. :-)

    I am using Firefox 23.0.1. Just checked it in other browsers:

    Chrome displays perfectly and as you see it.

    IE 10.0.9200.16660 same problem as in Firefox displaying the bullet to the left of the icon.

    Safari displays correctly with no bullet to the left of the icon; however, the font resolution is terrible.

    Inserted the entry-content code in Quick CSS and cleared cache. It did not make any difference.

    August 25, 2013 at 3:07 pm #136859
    Devin

    Hi vlane,

    Try changing the list css to:

    .avia-icon-list .iconlist_content_wrap li {
    
margin: 0;
    
padding: 0 0 30px 0;
    
list-style-type: circle !important;
    
list-style-position: outside;
    
clear: both;
    
overflow: visible;
    
position: relative;
    
min-height: 60px;
    
}

    Which will target the list elements inside the icon list instead of the icon list items themselves.

    Regards,

    Devin

    August 25, 2013 at 5:20 pm #136860
    Valerie

    Thanks for the attempt, Devin. Inserted into Quick CSS and saw no change. See links to screenshots below.

    Firefox: bullet still left of icon image http://talentdev.valiantlane.com/wp-content/uploads/2013/08/bullets_Aug25.png

    IE: — bullet still left of icon image http://talentdev.valiantlane.com/wp-content/uploads/2013/08/bullets_Aug25_IE.png

    — top nav page indicator “nub” on the line doesn’t display http://talentdev.valiantlane.com/wp-content/uploads/2013/08/nubissue_Aug25.png

    Safari: no bullet or nub issues, but the font resolution is terrible http://talentdev.valiantlane.com/wp-content/uploads/2013/08/fontissue_Safari.png

    August 26, 2013 at 8:33 pm #136861
    Devin

    You still have:

    .avia-icon-list li {
    
margin: 0;
    
padding: 0 0 30px 0;
    
list-style-type: circle !important;
    
list-style-position: outside;
    
clear: both;
    
overflow: visible;
    
position: relative;
    
min-height: 60px;
    
}

    Which is causing that to happen. You need to get rid of that block of css so it doesn’t cause the issue and only the css from my previous post effects your list items inside the icon lists.

    August 27, 2013 at 2:00 pm #136862
    Valerie

    Yep, works like a charm! Thank you very much.

    What do you think about the font display issue in Safari? Should I start a new thread for that?

    August 28, 2013 at 4:20 am #136863
    Ismael

    Hey,

    Have your tried using another font on Enfold > Styling > Defines the Font for your body text?

    Regards,

    Ismael

    August 28, 2013 at 3:53 pm #136864
    Valerie

    Hi Ismael,

    I am using Arial, which should display well in Safari. I found the solution: in Safari in preferences under appearance, I found a setting for font smoothing. When I changed it to “Medium – best for Flat Panel” that took care of the issue.

    An FYI for all of us!

    Thanks for your great help in customizing my site.

    Valerie.

    August 29, 2013 at 3:50 pm #136865
    Devin

    Glad we could help. Let us know if you have any other questions or issues :)

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Enfold: Font & Bullet Issues in Icon List Text’ is closed to new replies.