Bootstrap Responsive Table Not Acting Responsive

.table-responsive should be on wrapper div because even if you use css property overflow:scroll scrollbar will not active on table tag so we are using a wrapper div with class table-responsive to show to scroll bar to make table responsive.

This is the reason we need to write responsive table code like this

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

Please re-read the docs on this feature. The table-responsive class needs to be on a wrapper div, not the table itself.

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>