Looking to see if anyone has some bullet proof js or css method to get the qualtrics iframe embeds responsive. I'm able to adjust width to the display width without problem. It's the height that's the trouble. No scroll bars on iphone, safari. I appreciate the help.

This should get you most of the way.##In the footer of "look and feel - advanced"```javascript<script src="https://pym.nprapps.org/pym.v1.min.js"></script><script>function renderWithTimeOut() { myVar = setTimeout(render, 4000);}function render() { pymChild.sendHeight();}var pymChild = new pym.Child({ renderCallback: renderWithTimeOut });</script>```##From the "+ Add custom CSS" button```csshtml {height: auto !important;}```##On your HTML /parent page:```html<div id="ELEMENT_ID"></div>``````javascript<script src="https://pym.nprapps.org/pym.v1.min.js"></script><script> var pymParent = new pym.Parent('ELEMENT_ID', 'URL_OF_QUALTRICS_FORM', {trackscroll: true});</script>```

Hello @dfairbairn Go with the below mentioned CSS code @media only screen and (max-width: 480px) { .form-textarea, .form-textbox, .form-dropdown, .form-radio, .form-checkbox{ width: 100% !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .form-label-left, .form-label-right{ width: auto; } .form-buttons-wrapper{ margin-left:0 !important; } .form-input { width: 100%; } .form-all{ width: 98%; } .form-sub-label-container { width: 100%; display:block; }

Responsive Embed of iFrame form | Experience Community

Sign up

Login to the Community

Scanning file for viruses.

This file cannot be downloaded