Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • November 11, 2014 at 12:28 am #349124
    valmil

    Hi Enfold support team,

    I need on my homepage: http://www.superbusyfit.com/
    5 icon boxes, with large icons on the left and full visibility of the text content.

    The homepage layout has 5 icon boxes (5 elements layout). The text does not fit in the boxes anymore.
    When I chose “display large icon on the left of the text title bar” the text is cut on the right side. I prefer large icons than small icons and I am happy to reduce the text size to fit but unfortunately there is no option to do so.

    A while back I had a very similar issue which was solved by Yigit with a piece of code here- this code does not work with 5 boxes
    https://kriesi.at/support/topic/icon-box-issue-text-not-displaying-fully-cannot-change-icon/

    I have played around a bit and tried a different strategy: I moved the 5 icon boxes titles (my text) to the text part underneath – allowing me to change the text size.
    Unfortunately it does not solve the problem:
    1) see “Networking event with pizza for choice?” is still cut and the icon box logo shows on top (on MacBookPro 17″retina). On ipad mini the text is misplaced as well as on iphone 5s.
    2) + the text is not centered with the logo like it is when you use the title bar – see the “traveling?” icon box.

    Thank you for your help, once again.

    Val

    NB: A great feature to be added to Enfold would be to have the possibility to change the size of the title bar text of the icon box (I can open a feature request if it was not already requested) + a “center text with logo” button

    November 11, 2014 at 5:18 am #349199
    valmil

    hey again,

    FYI- just went and tried this:
    took the added code belwo out of quick CSS
    .iconbox_left_content .iconbox_content, .iconbox_right_content .iconbox_content {
    overflow: visible;
    }
    so now it “fits”in width but the “bottom of the words” are not showing properly…

    November 12, 2014 at 12:54 am #349793
    Elliott

    Hi!

    I’m not sure what the best way to go about this is. We can try reducing the margin and increase the width a bit with this CSS.

    <style type = "text/css">
.av_one_fifth {
    width: 18% !important;
    margin-left: 2% !important;
}
</style>

    Try dragging a codebox element into your content and add that inside.

    Cheers!
    Elliott

    • This reply was modified 10 years ago by Elliott.
    November 13, 2014 at 4:54 am #350567
    valmil

    hi Elliott- I have tried but unfortunately it does not work

    It looks like there is an issue with the icon box when you chose “heading” for font. it seems to cut all letters like “g” or “p”…even if there is plenty of space in the box for them…
    I had 4 lines of text fitting perfectly in teh box and 1 line “traveling” having the “g” cut…
    Right now I have used “address” as font and it fits… but this font is far too small…

    If you can think about another option please let me know.
    thanks

    November 14, 2014 at 12:19 am #351014
    Elliott

    Hi!

    You can use this CSS to get rid of the cutting.

    .iconbox_left_content .iconbox_content, .iconbox_right_content .iconbox_content {
    overflow: visible !important;
}

    I think it would be best to switch it to 4 columns though. There just isn’t enough space for that on small screens.

    Regards,
    Elliott

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