Responsive iFrame

Hi. I have a responsive app which I've put into an iFrame.

Part of the "style" of the iFrame allows for responsiveness on the width, which works fine when pasting the iFrame code into a Text block.

The problem is the "height" isn't responsive.

I've read a couple of posts on the net which talk about wrapping the iFrame with "div's" and adding CSS to control the responsiveness of the iFrame via the div.

I've tried it but unfortunately it doesn't work ie. what happens when reducing the size of the web browser is the width adjusts but the height leaves a large blank under the main content.

I'm hoping someone else has this going within a Text block (or some other way) and can advise how to get a responsive iFrame.

Thank you.

without a url so I can see the exact problem is it very hard to debug the issue for you, however my first suggestion would be trying to add some css for the iframe. 

Hav you tried something to the effect of

iframe {max-height: 100%;}


If that doesn't work, I would recommend a flexbox approach.

body {margin:0;}.parent {display: flex;flex-direction: column;min-height:100vh;}.parent .banner {background:#f00;width:100%;height:30px;}.parent iframe {background:#000;border: none;flex-grow:1;}

<divclass="parent"><divclass="banner"></div><iframe></iframe> 
</div> 

If all else fails, drop a link to the problem.