Tagged: ,

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • October 17, 2013 at 10:40 pm #177190
    Gstar72

    Hi Fellas,

    Hope you are all great.

    Question: I had an issue with the icon list and accompanying text – when shown on an iPad / iPhone the text and icons get chopped. Ismael kindly gave me this fix to go in custom CSS: https://kriesi.at/support/topic/icon-list-issue-on-ipad/#post-27653 (see below):

    @media only screen and (min-width: 786px) and (max-width: 1000px) {
    .avia-icon-list .iconlist_icon {
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 25px;
    margin-right: 15px;
    }
    }

    I checked my site on an iPad today and the problems are still the same, cut off text and icon – is there any way for this to resize?.

    Thanks guys

    Gary

    October 17, 2013 at 10:44 pm #177194
    Gstar72

    My website: http://www.naturaloutlook.com

    October 18, 2013 at 4:34 pm #177463
    Yigit

    Hey!

    Please try adding following code to Quick CSS in Enfold theme options under Styling tab

    @media only screen and (min-width: 786px) { .avia-icon-list .iconlist_content_wrap { margin-right: -10px!important; }}

    Best regards,
    Yigit

    • This reply was modified 11 years, 1 month ago by Yigit.
    October 18, 2013 at 4:36 pm #177464
    Gstar72

    Thanks Yigit,

    Should I replace tis code with your suggestion:

    @media only screen and (min-width: 786px) and (max-width: 1000px) {
    .avia-icon-list .iconlist_icon {
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 25px;
    margin-right: 15px;
    }
    }

    Gary

    October 18, 2013 at 4:39 pm #177468
    Yigit

    Hey!

    No, keep it and place the code i posted below it :)

    Best regards,
    Yigit

    October 18, 2013 at 4:41 pm #177471
    Gstar72

    Thanks Yigit,

    Much appreciated.

    Gary : )

    October 18, 2013 at 7:44 pm #177547
    Gstar72

    Hi Yigit,

    I tested the site on an iPad and iPad mini and I still have the same error – the text gets cut off due to the narrow margin / column size. Perhaps the issue is because the text stays the same point size regardless of the device – is there any way around this – aside form using different elements?.

    Best regards, Thankyou

    Gary

    October 19, 2013 at 12:26 pm #177845
    Yigit

    Hi!

    I updated the code in this post https://kriesi.at/support/topic/icon-list-error-on-ipad/#post-177463
    Please try this one

    Regards,
    Yigit

    October 19, 2013 at 10:43 pm #177951
    Gstar72

    Hi Yigit,

    Thankyou for the code, I tried to implement the code in the Enfold Custom CSS as follows:

    @media only screen and (min-width: 786px) and (max-width: 1000px) {
    .avia-icon-list .iconlist_icon {
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 25px;
    margin-right: 15px;
    }
    }

    @media only screen and (min-width: 786px) and (max-width: 1000px) { .avia-icon-list .iconlist_content_wrap { margin-right: -10px!important; }}

    There still seems to be a problem with the text staying the same size and icons cut in half due to smaller column size on iPad / iPhone. Can you check http://www.naturaloutlook.com on your mobile device…I tried it on a new iPad mini….

    Can you see any errors with the code?

    Thankyou

    Gary

    October 20, 2013 at 4:41 pm #178082
    Yigit

    Hey!

    You should remove following part as i did in my updated code :) 

    and (max-width: 1000px)

    Best regards,
    Yigit

    October 20, 2013 at 8:54 pm #178163
    Gstar72

    Thankyou Yigit,

    I have made the changes, I had to add </br> to give some separation between the icon and the text – something has changed though – I will have to go to a local electronics store to see the changes on an iPad as I don;t have one, but thankyou for your help, I appreciate it.

    Best wishes,

    Gary

    October 21, 2013 at 3:35 pm #178444
    Yigit

    Hey!

    You are welcome Gary. I do not have one either. I am not closing the thread, so please let us know after you check it.

    Regards,
    Yigit

    October 22, 2013 at 6:37 pm #179178
    Gstar72

    Hi Yigit,

    Sorry to trouble you again, I still have problems with the icons on iPad – iPhone and text being cut off – I removed the code from above as it placed the txt that was to originally to the right of the icons, below it, however there were alignment issues, then the icons in each column would randomly twitch / move (maybe a different update and it looked like a line of pixels were missing, very strange.

    If anyone else brings this up, or you guys can think of a different work around solution, please let me know.

    Here was Ismael’s original thread: https://kriesi.at/support/topic/icon-list-issue-on-ipad/#post-134838

    Thankyou for your help, you guys are the best!.

    Gary

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Icon List Error on iPad’ is closed to new replies.