JSFiddle - React, Tailwind, and code Playground

HTML

<div class="maxHeight">
    <table class="browseTbl sortable">
        <thead>
            <tr>
                <th>&nbsp;</th>
                <th>Image</th>
                <th class="small">&nbsp;</th>
            </tr>
        </thead>
        <tbody>
            <tr class="row1" style="">        
                <td>2</td>
                <td class="middle">
                    <a class="image" href=""><img src="http://www.freedigitalphotos.net/images/gal_images/av-_55.jpg"></a></td>
                <td><a class="button" href="">Edit</a></td>
            </tr>
            <tr class="row1" style="">        
                <td>2</td>
                <td class="middle">
                    <a class="image" href=""><img src="http://www.freedigitalphotos.net/images/gal_images/av-_55.jpg"></a></td>
                <td><a class="button" href="">Edit</a></td></td>
            </tr>
            <tr class="row1" style="">        
                <td>3</td>
                <td class="middle">
                    <a class="image" href=""><img src="http://www.freedigitalphotos.net/images/gal_images/av-_55.jpg"></a></td>
                <td>Foo</td>
            </tr>
            <tr class="row1" style="">        
                <td>4</td>
                <td class="middle">
                    <a class="image" href=""><img src="http://www.freedigitalphotos.net/images/gal_images/av-_55.jpg"></a></td>
                <td><a class="button" href="">Edit</a></td></td>
            </tr>
        </tbody>
    </table>
</div>

CSS

.maxHeight {
    clear: both;
    margin: 10px auto;
    max-height: 150px;
    overflow-x: hidden;
    overflow-y: auto;
}

.button {
display: block;
 border: 1px solid red;
 text-align: center;
    width: 60px;
    margin: 0 auto;
}

.image {
    background: none repeat scroll 0 0 #E7E7E7;
    border: 1px solid #C7C7BB;
    display: inline-block;
    margin: 4px 2px 0 0;
    padding: 4px;
}
.image img {
    display: block;
    float: none;
    margin: 0 auto;
    text-align: center;
}
table {
    background: #9F9F9F;
    border-bottom: 1px solid #9F9F9F;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-right: 1px solid #9F9F9F;
    color: #010101;
    margin: 5px 0;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;   
}
table th {
    background: #000000;
    border-left: 1px solid #363636;
    color: #FFFFFF;
    font: 13px/1 Georgia,"Times New Roman","Bitstream Charter",Times,serif;
    height: 28px;
    padding: 0 6px;
    text-align: center;
    vertical-align: middle;
}
table td {
    background: #F9F9F9;
    border-bottom: 1px solid #363636;
    border-left: 1px solid #363636;
    line-height: 16px;
    padding: 6px 8px;
    vertical-align: middle;
    word-wrap: break-word;
}
table td.middle { text-align: center; }
table th.small { width: 70px; }