table-overflow.css

.table-wrap {
  width: 100%;
  overflow-x: scroll;
  margin-bottom: 50px;
}
table {
  min-width: 600px;
  border-spacing: 0;
  border-collapse: collapse;
}

table-overflow.js

var App = {};

// responsive scrolling tables
App.responsiveTables = function() {
  $( "table" ).wrap( "<div class='table-wrap'></div>");
};

$(document).ready(function() {
  App.responsiveTables();
});

table.html

              <table>
                <thead>
                  <tr>
                    <th>Table header</th>
                    <th>Table header</th>
                    <th>Table header</th>
                    <th>Table header</th>
                    <th>Table header</th>
                    <th>Table header</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                  </tr>
                  <tr>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                  </tr>
                  <tr>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                    <td>Table Cell</td>
                  </tr>
                </tbody>
              </table>