Problems with Typeform code not displaying properly on iOS

Hello I have a mobile app with Typeform HTML embedded into the home page of the app. On Android phones this is displaying well but on iPhone it is small and hard to read. Can any of you see what is the problem with the code below? Thanks so much

<div class="typeform-widget" data-url="https://athenaonharris.typeform.com/to/o71gHv" style="width: 100%; height: 100%;"></div> 
<script> (function() { var qs,js,q,s,d=document, gi=d.getElementById, ce=d.createElement, gt=d.getElementsByTagName, id="typef_orm", b="https://embed.typeform.com/"; if(!gi.call(d,id)) { js=ce.call(d,"script"); js.id=id; js.src=b+"embed.js"; q=gt.call(d,"script")[0]; q.parentNode.insertBefore(js,q) } })() </script>

The problem is… I can´t see any code… :smirk:

I updated that code so that it is visible. I usually recommend linking directly to Typeforms since their embed code is pretty bad. Would that be possible for your setup?

Hi Daniel, The problem is that the form is really the main functionality of my app so I want that displayed on the home page rather than an external link. It functions perfectly on Android but as mentioned appears small on iOS. Ive attached a photo here showing the difference. Is there any way to update the code? Typeform has been no help which is disappointing since i pay them $50 a month for their service. 93537941_545418753018366_6543299091097452544_n

Try adding:

<style>.typeform-widget {height:100vh !important;}</style>

…to the page it is on or inside the inner HTML of a rectangle.

1 Like

Thank you so much that fixed the issue. So grateful!

Hi Daniel I have another problem with this section of code if you might be able to help me. Now that I have added slightly more content into this typeform I notice on the mobile app it doesn’t seem possible to scroll up and down. I have tried adding things along the lines of

<div style="overflow-y: scroll; height:400px;">

without any success. Thanks

Here’s what I tried (maybe 90vh would be better?)

typeform.html.zip (1.1 KB)

I’m going to need more info about what devices you’re working with. Can you share your code / Hype document?

It’s funny that you’re paying typeform $50 / month for their service and they won’t help you out.

1 Like

Hi here is the code: <style>.typeform-widget {height:100vh !important;}</style><dv class="typeform-widget" data-url="https://athenaonharris.typeform.com/to/o71gHv" style="width: 100%; height: 100%;"></div> <script> (function() { var qs,js,q,s,d=document, gi=d.getElementById, ce=d.createElement, gt=d.getElementsByTagName, id="typef_orm", b="https://embed.typeform.com/"; if(!gi.call(d,id)) { js=ce.call(d,"script"); js.id=id; js.src=b+"embed.js"; q=gt.call(d,"script")[0]; q.parentNode.insertBefore(js,q) } })() </script>

Device wise im using an android mobile but believe the problem on ios too. Thank