You have a great website with responsive design and number of tables which fit the smaller viewports well.. say, like described in my post Responsive Tables. Every table has horizontal scroll for mobile-sized view, without breaking layout. It happens because of CSS settings for the table ‘display:block;’ and ‘overflow-x:auto;’. A user can swipe right and left to horizontal scroll the table to see the content.
A bad news is the user has no indication that they can swipe to the right (the momentum effect) – many mobile browsers don’t show scrollbars at all, while some show them only while scrolling…

The solution is to use

overflow-x:scroll;/* instead of 'auto' */

-webkit-overflow-scrolling: touch;

and even add custom scrollbar (for Chrome at least):

::-webkit-scrollbar-track{

background-color:#F5F5F5;

}

::-webkit-scrollbar{

width:12px;

background-color: rgba(0,0,0,0);

}

::-webkit-scrollbar:hover{

background-color: rgba(0, 0, 0, 0.09);

}

::-webkit-scrollbar-thumb{

background: rgba(0, 0, 0, 0.3);

border:2pxsolid#F5F5F5;

-webkit-border-radius:100px;

}

::-webkit-scrollbar-thumb:active{

background: rgba(0,0,0,0.61);

-webkit-border-radius:100px;

}

The above is a must if you design for mobile devices and produce applications using WebViews.