I have an iframe that must be embedded on some websites and it is not well displayed on iPhones. This is because the width
attribute (probably height
as well) is ignored by mobile Safari.
Is there any workaround?
Thanks!
Although width
is ignored, min-width
isn't. So something like this has the same effect as width:100%
:
iframe {
width: 1px;
min-width: 100%;
}
The width
parameter of the iframe is ignored in mobile Safari so the width must be set in px with CSS.
I fixed the problem by checking the user agent with JavaScript. If it's an iOS device, I set the width of the iframe in px with CSS to be the exact size as the container.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With