JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<div style="border:1px solid red;">


                    <table class="item-inner">
                        <tr>
                            <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                            <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                            
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                                <img class="img-responsive" src="images/#">
                            </td>
                                                        <td class="item-thumb">
                   ...

CSS

.canvas-scrollable{
    width: 100%;
    height: auto;
    overflow-y: hidden;
    overflow-x: auto;
}

.canvas-scrollable .item-inner{
    height: 300px;
    margin: 10px;
    /*white-space:nowrap;*/
    background: #FFFFFF;
    border: 1px solid rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 13px 8px -10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 13px 8px -10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 13px 8px -10px rgba(0, 0, 0, 0.1);
}

.item-thumb{
  width: 50%;
  height:50%;
  padding: 4px;
  border: 1px solid green;
}

.item-thumb img{
    height: 100%;
    object-fit: cover;
}