Forum Discussion

OscarBrooman-Wh's avatar
OscarBrooman-Wh
Community Member
2 years ago

Make embedded form full height

Hi there,

I currently use a custom form to track who is completing their eLearning and I use the Embed block in Rise.  In "Full-width" display, it works great on a computer, but when on iPad or mobile device, the block only takes up 1/4 of the screen and people are finding it challenging to scroll in such a small block and thus are unable to complete the form.

Is there a way of making the Embed block take up the full height of the device, and not just the full width? Happy to use any coding workarounds or any solutions!

 

Thanks for your time and help.

Oscar

  • Hi there!

    I understand that you would like your embedded form to take up the full height of the device instead of just the full width. Thanks for sharing the screenshots!

    Would you be able to share the embed code that you used so that I can check?

      • hazelB's avatar
        hazelB
        Staff

        Thanks Oscar for sharing your iframe code.

        I tried to tweak it a bit:

        <iframe src="https://backcountrylearning.com/briefings/ustml/form/form.php" width="100%" height="790px" frameBorder="0" style="border: 0;"></iframe>

        I did some testing and the orientation is better in a tablet instead of a mobile phone, where the scroll bar still appears.

        I observed that the form in the link is already vertical. When we embed it using iFrame, it is scaled by Rise automatically. So sorry there isn't a way to adjust the height to take up the whole phone screen. Maybe you can play around with the form's width from the original source and see if the appearance will improve.