form embed code won't scroll the form on mobile phone when tested

[r_tist]

I have a landing page, and injected embed code for a form.

On desktop, this works flawlessly. The form is long, requires some scrolling.

On mobile phone - no scrolling occurs. End-user would be stuck and only see the first two fields.

How should this issue be handled? - Would additional code get added to the embed code script itself, or directly to the landing page (e.g. - CSS applied near the area of where the embed code script is injected)?

Please advise. Thank you.

[Nancy OShea]

Is <form> embedded inside an <iframe>?  

Is <iframe> scrolling enabled (default) or disabled? 

What height value is the <iframe>?  Try changing value until you see a vertical scrollbar.

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe_frameborder_css

[r_tist]

The embed code for the form is a script. it opens and closes with script tags.

I will work at it and let you know if I get any results.

[Nancy OShea]

Contact whoever makes the script.  Maybe they have a solution.

[r_tist]

Not sure how to pull in the embed code <script> via the src reference. I mean, I know that's not right and possibly there is another way?

Then, instead of the embed script, I pulled in the URL for the form from HubSpot into the iFrame on the landing page. The landing page is in another platform.

This did work, however, form will not submit data via the iFrame. Is there a cross domain security issue? - Something is blocking the ability to submit the form when pulled in this alternative way.

[r_tist · Accepted solution]

Pulling in the URL to the form via source did work after all. I needed to try some tests.

[Nancy OShea]

Which mobile phone model and browser/version are you using to test with?

This might work in Safari.  I haven't tested it.

<div style="postion:abosolute; overflow: auto!important; -webkit-overflow-scrolling: touch!important;">
<iframe>Loading...</iframe>
</div>