ScrollX doesn't work on chrome Android.

martinktm

Hi,

scrollX doesn't work on android chrome. It works on desktop if I test responsiveness and on UCbrowser. On chrome android table is displayed as full width.

Here is my code:

$('#websites_table').DataTable({
"scrollX": true,
"dom": 'frtp',
"order": [],
columnDefs: [
{ width: "150px", className: 'align-middle', responsivePriority: 1, targets: 0 },
{ width: "400px", className: 'align-middle', responsivePriority: 0, targets: 1 },
{ width: "100px", className: 'align-middle', responsivePriority: 2, targets: 2 },
{ width: "200px", className: 'align-middle text-center', orderable: false, responsivePriority: 3, targets: 3 },

],

});

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

martinktm

Hi colin,

Your comment got me thinking that the problem is not datatables but somewhere else(I was assuming it is datatables because it did work everywhere but chrome android). So I removed some classes from table and found the class that was causing problem. And it was CSS code : table-layout: fixed; that was preventing scrolling on chrome android.

Thanks for your reply.