Configure iframes for IOS


As you have maybe found out already IOS does not like iframes. Safari does not treat them like all other major browsers.

The main problems are:

  • scrolling does not work
  • the width settings are simple ignored

Why? Only apple knows….

There are many solutions to tackle this problem and I have integrated the ones which seems to work best. Especially for the scrolling the best working solution does work on IOS but on Desktop the page does not wok properly.

Therefore the plugin does also use the internal browser detection to apply the workaround only for IOS. The following 2 settings apply the workarounds:

  • Scrolling: enable_ios_mobile_scolling=”true” -> This adds additional divs with specific safari styles
  • Width:¬† enable_responsive_iframe=”true” -> This adds additional styles (min-width and max-width) which IOS respects (not sure if this changes from version to version)

If the 2 workaround do not work I recommend to use a IOS specific solution. You can use the internal browser detection and display either a link instead of the iframe or you can redirect the user directly to the page in the iframe.

If you find a solution which is not integrated in the iframe please let me know. I’m always happy to add a more stable solution.

Best, Michael