title: Bootstrap responsive table doesn't scroll horizontally on iOS devices
body: <p>I have a table with the following markup:</p>
  
  <pre><code>&lt;div class="table-responsive"
      &lt;table class="table table-hover"
          &lt;!-- table data--&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As the documentation says, my table should now be able to scroll horizontally. It does work if I use chrome's devices emulator. However, when I try it using a real iPhone (iPhone 5s in this case - tested on iPhone 6 as-well) then I can't scroll the table horizontally at all. I can see the last column displayed in the viewport by default and I just can't scroll it side ways. I tried that in chrome and safari on my iPhone and got the same behavior.</p>
  
  <p>What I tried to do is add the <code>-webkit-overflow-scroll: touch</code> but it didn't solve the problem. I've also tried to manually add <code>overflow-x: scroll</code> instead of the default <code>auto</code> but no avail.</p>
  
  <p>I'm not sure it matters but I also have a bootstrap plugin - offcanvas - by <a href="http://www.jasny.net/bootstrap/components/" rel="noreferrer">jasny bootstrap</a> and I can't scroll that side menu vertically on my iPhone as-well. It all works in the emulators but fails on the real thing.</p>
  
  <p>Maybe those two are connected somehow.</p>
  
  <p>Any help is appreciated.</p>
  
  <h2>Edit:</h2>
  
  <p>I have just tested that on an android phone and it seems like I can scroll the table horizontally as expected. However, I still can't scroll the side menu vertically even on android. I guess it means that these problems aren't connected to each other. </p>