Solution 1 :

As per typeform community post (https://community.typeform.com/integrate-your-typeform-43/typeform-full-page-embed-not-filling-full-page-on-my-wordpress-site-5072?postid=28836#post28836), try this:

<style>
     #wrapper {
        width: 100%;
        height: 100%;
        min-height: 100vh;
    }
    iframe {
        border-radius: 0 !important;
        width: 100%!important;
        height: 100vh!important;
    }

</style>
<div id="wrapper" class="alignwide" data-tf-widget="bUfkO2GI" data-tf-inline-on-mobile data-tf-medium="snippet"></div>
<script src="//embed.typeform.com/next/embed.js"></script>

Solution 2 :

Hi Uffe and welcome to StackOverflow

You can specify a height in pixel too, this is for example how it would look like if you do height: 250px;

https://www.evernote.com/l/ACVK-joRZgRCR7fR61-TARyiCTaJr77ng8cB/image.png

One alternative could also be to use the official Typeform WordPress plugin.

Hope it helps

Problem :

I am having trouble making a embedded Typeform 100% height.

The div is 250 px in height and i want the Typeform to take up all 250px. In the embed code from Typeforms own website the height is set to 100%.
Image from Typeform

I have made an example page here -> https://datapilot.dk/hoffaps-demo/test-page/ – the typeform should take up all the blue space.

I use the theme Uncode for wordpress.

Help me please!

By

Leave a Reply

Your email address will not be published. Required fields are marked *