JSFiddle - React, Tailwind, and code Playground

by sandeep

HTML

<table border="1" class="my-table"> 
  <tr class="head"> 
       <th>head-1</th> 
       <th>head-2</th> 
       <th>head-3</th> 
       <th>head-4</th> 
       <th>head-5</th>    
  </tr> 
  <tr>
           <td>data-1</td> 
           <td>data-2</td> 
           <td>data-3</td> 
           <td>data-4</td> 
           <td>data-5</td> 
  </tr> 
 </table>

CSS

td{
    background-color:red;
}
td:first-child{
    border-radius:10px 0 0 10px;
   -webkit-border-radius:10px 0 0 10px;
   -moz-border-radius:10px 0 0 10px;
}
td:last-child{
     border-radius:0 10px 10px 0;
    -webkit-border-radius:0 10px 10px 0;
    -moz-border-radius:0 10px 10px 0;
 }