Form is cuts off the form on the mobile version

I am still having issues. The online application seems to be fine on the desktop but it cuts off the form on the mobile version (I am using an iphone). I've attached a screenshot to show you where it cuts off the first page of the application. Please help.

I do not have iPhone, but I have tested your form on my Samsung Galaxy S4 and I was able to replicate same issue, bottom of the page is cut off. However on my end I am able to see two more fields. 

I have inspected your webpage and I saw that you have embedded your form with iFrame code. However it seems that you have removed script part of iFrame code. I also saw that you have set height of your iFrame code to 3000px. Please try to add !important rule to height of your iFrame code, to see if that will resolve your issue or try to increse height a bit more. 

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

If that dose not resolve your issue, you can cry to re-embed your form with iFrame code, but this time do not remove script par of the code. 

Hope this will help. Let us know if you need further assistance.

I adjusted the code as you stated and it didn't work, so I re-embedded the iFrame code and left the highlighted part in the code as well and it still doesn't work although I was able to see another field or so. Here is a screen shot from my phone:

I made some additional tests and it seems that height of div element inside of which your form is embedded has fixed height set to 1896px. 

#wsb-element-62071b83-c8db-4d6a-a889-7e4b1ab8e196 .wsb-htmlsnippet-element

You will need to increase the height of that element, in order to show whole form on mobile devices.

Let us know if you need further assistance.

Sorry, I realized I didn't sign in. Thank you. That worked, however when I tested it on my iphone and went to the second page of the application the top part was cut off. I could not see any questions and I couldn't hit next because some of the questions at the top were not visible, see screen shot below:

I have tested your form on my Samsung Galaxy S4, but I was not able to replicate mentioned issue. Are you able to scroll up and down on your phone?

 

Considering that your original issue was related to height of div element of your webpage, please try to remove script part of iFrame code to see if that will resolve your issue. 

No, not on the form. I cleared the cache and history on my phone and tried it again and I still have the same issue.

Hi,

Thank you for contacting us.

I have checked your website that embedded your form on Iphone7 & Safari but everything works properly on my side. As you can see below screenshot:

Are solve this issue on your own? Also, I have checked your website on Desktop. You can disable gray background on your form. You can use this CSS code:

I have the form's height set that way because if certain questions are answered a certain way more questions will populate. Does that make sense? I tried the online application on my iphone this morning and the top part of the second page was still cut off, see screen shot below.

Unfortunately I do not have iPhone to test your embedded form. I think that form is also cut off on the screenshot that my colleague provided. There should be 4 fields above DateTime field. I asked My colleague Kade to test your embedded form and on his end form is also cut off. 

There should be 4 other fields above DateTime field, right? Like on screenshot from my phone.

I am not exactly sure what is causing  this issue. Your form is very long with lot of conditions. 

Please try to change scrolling from No to Yes inside of your iFrame code. 

 

<iframe id="JotFormIFrame-61245339755158" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/61245339755158" frameborder="0" style="width:100%; height:3500px!important; border:none;" scrolling="yes"> </iframe>