Horizontal scroll on iPhone / iPad

Suite and Optimus Suite 5
#1

Hi,

I’m struggling to find an error causing my grid not to scroll horizontally on iPhone/iPad. Unfortunately I can’t repeat this problem on demos available on dhtmlx.com. It works just fine. This of course means problem is somewhere in my application. Problem is that it’s quite complex and I can’t exactly find what is causing the issue. My grid is nested into draggable, resizable window (jQuery UI). I’m also using Bootstrap. I’m pasting screenshot to give rough idea how it looks.

I know it’s pretty hard to answer this, but I’m kind of stuck now. I would appreciate any wild guess what could I look for. Problem is on Apple devices only. It scrolls ok on Android (note, this is only about horizontal scroll).

Thank you in advance!

grid.png773×404 97.9 KB

#2

The problem may occur if you have several horizontal scrolls on your page.
f.e. your html body has a hor.scroll and your grid has a hor.scroll.
In this case scrolling on apple devices may stuck.

#3

That’s not the case unfortunately.

#4

Unfortunately it’s hard to find a reason of the problem without any example.
If it’s possible please, share with a demo link or provide with a simplified complete demo, so your grid could be checked.

#5

Yes, I know. I’m working now on taking out all surrounding code. I’m hoping to have it boiled down to demo I can share. As for now, it’s not possible.

#6

Hi again,

now I found the reason, namely - bootstrap. When I disable bootstrap CSS, scroll works fine on iOS. Does any of you have experience with using the Grid and bootstrap? How can I clearly separate it?

#7

This part of bootstrap.css is making a mess:

table {
max-width: 100%;
background-color: #ffffff;
}

I’ve made workaround in my CSS, so now the problem is solved.