overflow-x: auto on iPhone is not scrolling

css, html, ios, iphone

Solution

I saw in your sources that you use bootstrap so why you don't just adapt the with to be all inside the screen without any scrolling (horizontal scrolling on cellphone is not really user-friendly for me).

If you really want to use scrolling, I recommend you to use:

`-webkit-overflow-scrolling: touch;`

instead of

`-webkit-overflow-scrolling-x: touch;`

Have you tried to use `!important`?

Problem

I have an iframe inside a div, which looks like: ``` <div align="center" style="z-index:0; -webkit-transform: translate3d(0,0,0); overflow-x:auto; -webkit-overflow-scrolling-x: touch"> <a href="c1" data="c1"></a> <script type="text/javascript" src="iframe-loader"></script> </div> ``` I want the entry form to be scrollable on the x-axis, so that it can be used in mobile phones. This is working correctly on desktop and other phones, such as Android, but when using Safari in iOS the scroll is not present or works randomly. Any possible fixes for this? Is this an iOS bug?

Original source