title: iframe auto height to 100%
body: <p>I'm trying to get this iframe to auto-adjust its height but whatever I do, it won't work! I have tried various combinations of using positions and other tricks in css. Somehow I'm missing out on something crucial.</p>
  
  <p>I can't use min-height or max-height since the forms will be different everytime and a lot of whitespace will be created.</p>
  
  <pre><code>    &lt;div class="row"&gt;
          &lt;div class="col-xs-12"&gt;
              &lt;iframe style="height: 100%;width: 100%; margin: 0;" src="https://docs.google.com/forms/d/1406PEfzY-ZV_nx2mACr6DBoyxm95JfGvhWftOml73xg/viewform?embedded=true" frameborder="0" marginheight="0" marginwidth="0"&gt;Loading...&lt;/iframe&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Could someone suggest where i'm going wrong?</p>