JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<div class="responsive"><div class="responsive-inner"><table><thead><tr><th>Product Price Sheet</th> <th>Sheet Name</th> <th>PDF</th> <th>Excel</th> <th>Effective Date</th> <th>Historical Sheets</th></tr></thead> <tbody><tr><td><strong>FPPI</strong></td> <td>SCI.FPPI-2.21</td> <td>
                                                                                                    --
                                                                                            </td> <td><a href="https://s3.us-east-1.amazonaws.com/anvilintl.com-newprod/price-sheets/excel/SCI.FPPI-2.21-website.xlsx"><i class="fa fa-file-excel-o"></i></a></td> <td>2/1/2021</td> <td><a href="https://anvilintl.imarc.io/price-sheets/fire-sprinkler-products-accessories-1/fppi?country=US">View History</a></td></tr></tbody> <tfoot></tfoot></table></div></div>

CSS

.responsive {
  width: 200px;
  border: 2px solid red;
  overflow-x: scroll;
}

.responsive-inner {
  background-color: blue;
}