Bootstrap: Table-Responsive issue with RTL on iOS Webkit

[zanderisrael]

If { direction:rtl;} style is added to table-responsive class, the table wont scroll on iOS devices.

On iOS 6 the table scrolls but there are glitches and missing text and on iOS 7 the table never scrolls at all.

[cvrebert]

We don't technically support RTL in general currently. It's on the long-term roadmap though.

None of the .table-responsive or .table styles seem direction-specific to me. Browser bug perhaps?

[zanderisrael]

Both chrome and safari act the same, yet desktop versions act normally.

[geosalameh]

There is a workaround to fix this;
I've added the below 2 lines to my CSS file

.table-responsive {
  direction: ltr;
}
.table-responsive > table {
  direction: rtl;
}

In addition, you need to change table scroll direction using JS

$(document).ready(function(){
  $('.table-responsive').scrollLeft(9999);
});

[shakercs]

the solution is :

@media (max-width: 767px){
.table-responsive {
direction: ltr;
}
}

[rubinsh]

thanks @geosalameh - it worked!

[hananint]

Thank you so much @geosalameh it worked perfectly