JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr class="box_gradient">
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>
    <tr>
        <td>7</td>
        <td>8</td>
        <td>9</td>
    </tr>
</table>

CSS

table {
    border-collapse: collapse;
    width: 130px;
}
tr {height: 30px;}
td {border: 1px solid black;}

.box_gradient {
    background-image: -moz-linear-gradient(left, #444444, #999999); /* FF3.6 */
    background-image: -webkit-gradient(linear,left top,right top,color-stop(0, #444444),color-stop(1, #999999)); /* Saf4+, Chrome */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6,IE7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999')"; /* IE8 */
}