I have the form installed in WordPress.. With a script try running it on safari iPhone it will not load the question correctly

  • 2adorable
    Asked on April 11, 2017 at 1:48 AM

    Check out my site www.durhamautomall.com

    I have the form installed in WordPress.. With a script try running it on safari iPhone it will not load the question correctly.. 

    Should I use iframe or jotform plugin for WordPress? 

  • Chriistian Jotform Support
    Replied on April 11, 2017 at 2:01 AM

    I checked your form (https://form.jotformpro.com/70980445129965) embedded on the site you have provided (www.durhamautomall.com)  on safari iPhone and I was able to see the issue.

    I have the form installed in WordPress Screenshot 20

    For embedding the form in Wordpress site, please try using the JotForm plugin and see if this helps to solve the issue.

    Please take a look at this guide: A guide to forms for WordPress users.

    Regards.

  • 2adorable
    Replied on April 11, 2017 at 4:47 AM

    didnt change anything

  • Nik_C
    Replied on April 11, 2017 at 5:18 AM

    Could you please try embedding with regular iFrame code:

    <iframe id="JotFormIFrame-70980445129965" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformpro.com/70980445129965" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe>

    Let us know if that worked.

    Thank you!

  • 2adorable
    Replied on April 11, 2017 at 9:12 AM

    I have the form installed in WordPress Screenshot 20

    Now it's even worse than before. The full question is not showing. 

    Looking fine on desktop screen though. This screen shot is on Android in chrome nexus 6p

  • 2adorable
    Replied on April 11, 2017 at 10:00 AM

    I have the form installed in WordPress Screenshot 20

    Even after significantly decreasing the size it's still the same result. Using iframe. 

    I will try with script 

    And embed code also but I'm sure end result will be the same. 

  • 2adorable
    Replied on April 11, 2017 at 10:06 AM

    Tried it with script and embed codes same result. Is there anything that can be done here. 

  • 2adorable
    Replied on April 11, 2017 at 10:20 AM

    I have the form installed in WordPress Screenshot 20

  • 2adorable
    Replied on April 11, 2017 at 10:21 AM

    Works on iPhone chrome browser but not on Android chrome. Doesn't work on safari browser on iPhone. Frustrating!

  • Nik_C
    Replied on April 11, 2017 at 11:58 AM

    Let me check this more and I'll get back to you as soon as possible.

    Thank you!

  • 2adorable
    Replied on April 11, 2017 at 5:11 PM

    any updates

  • Nik_C
    Replied on April 11, 2017 at 5:35 PM

    Thank you for your patience.

    Please copy and paste the below CSS code in your Custom CSS field:

    @media only screen 

    and (min-device-width : 414px) 

    and (max-device-width : 736px) { 

      #radiosContainer {

        width: 320px!important;

        margin-left: -7%!important;

    }

      .form-pagebreak-next-container {

        width: 183px!important;

    }

    }

     

    @media only screen 

    and (min-device-width : 320px) 

    and (max-device-width : 568px) { 

    #radiosContainer {

        width: 320px!important;

        margin-left: -7%!important;

    }

      .form-pagebreak-next-container {

        width: 183px!important;

    }

    }

    I tested on several devices and it worked the same on all, iPhone 5, 6, 6s, Galaxy Note 3.

    Here is the screenshot from my Android phone:

    I have the form installed in WordPress Screenshot 20

    Please let us know how it worked.

    Thank you!

  • 2adorable
    Replied on April 11, 2017 at 5:53 PM

    am i pasting this code in the css for the whole form or just the question it self. and do i remove the current css code that i have in the question it self? 

     

    and thank you for your help

  • Chriistian Jotform Support
    Replied on April 11, 2017 at 7:02 PM

    Hi there,

    I think you can add the CSS provided by my colleague and apply it to your whole form without removing the current CSS.

    Let us know it goes.

  • 2adorable
    Replied on April 12, 2017 at 3:26 AM

    ok thanks it worked!!!