clevy
(Chris Levy)
September 2, 2019, 7:40pm
1
Hi Everyone,
I can’t seem to get this iframe code to work on mobile. Everything gets pushed to the right. Is this being caused by webflow CSS?
<iframe src="//virtualsen.se/wpdemo4/mapplic_map/mountain-springs/" height="600" style="width: 100% !important; min-width: 100% !important; *width: 100% !important; max-width: 100% !important; border: none;"></iframe>
Live Site
https://communities.ah4r.com/interactive-map-test
Webflow Share Link
https://preview.webflow.com/preview/new-communities-site?utm_medium=preview_link&utm_source=dashboard&utm_content=new-communities-site&preview=fd724fc1c6fbdb217e977f08c2a80b8c&mode=preview
Thank you in advance for any insight!
clevy
(Chris Levy)
September 3, 2019, 7:04pm
2
Found the solution. Please close.
It turns out that this is an iOS bug: css - How to get iframe width 100% in iPhone portrait view - Stack Overflow
After testing it on our site, I can confirm that this embed code is finally responsive. The important part that I was missing is the scrolling=“no” attribute.