JSFiddle - React, Tailwind, and code Playground
HTML
<div class="CSSTableGenerator" >
<table >
<tr>
<td>
Title 1
</td>
<td >
Title 2
</td>
<td>
Title 3
</td>
</tr>
<tr>
<td >
Row 1
</td>
<td>
Row 1
</td>
<td>
Row 1
</td>
</tr>
<tr>
<td >
Row 2
</td>
<td>
Row 2
</td>
<td>
Row 2
</td>
</tr>
<tr>
<td >
Row 2
</td>
<td>
Row 2
</td>
<td>
Row 2
</td>
</tr>
<tr>
<td >
Row 3
</td>
<td>
Row 3
</td>
<td>
Row 3
</td>
</tr>
</table>
</div>
CSS
.CSSTableGenerator {
margin:0px;padding:0px;
width:100%;
box-shadow: 10px 10px 5px #888888;
border:1px solid #000000;
-moz-border-radius-bottomleft:14px;
-webkit-border-bottom-left-radius:14px;
border-bottom-left-radius:14px;
-moz-border-radius-bottomright:14px;
-webkit-border-bottom-right-radius:14px;
border-bottom-right-radius:14px;
-moz-border-radius-topright:14px;
-webkit-border-top-right-radius:14px;
border-top-right-radius:14px;
-moz-border-radius-topleft:14px;
-webkit-border-top-left-radius:14px;
border-top-left-radius:14px;
}.CSSTableGenerator table{
border-collapse: collapse;
border-spacing: 0;
width:100%;
height:100%;
margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
-moz-border-radius-bottomright:14px;
-webkit-border-bottom-right-radius:14px;
border-bottom-right-radius:14px;
}
.CSSTableGenerator table tr:first-child td:first-child {
-moz-border-radius-topleft:14px;
-webkit-border-top-left-radius:14px;
border-top-left-radius:14px;
}
.CSSTableGenerator table tr:first-child td:last-child {
-moz-border-radius-topright:14px;
-webkit-border-top-right-radius:14px;
border-top-right-radius:14px;
}.CSSTableGenerator tr:last-child td:first-child{
-moz-border-radius-bottomleft:14px;
-webkit-border-bottom-left-radius:14px;
border-bottom-left-radius:14px;
}.CSSTableGenerator tr:hover td{
}
.CSSTableGenerator tr:nth-child(odd){ background-color:#a6dd99; }
.CSSTableGenerator tr:nth-child(even) { background-color:#ffffff; }.CSSTableGenerator td{
vertical-align:middle;
border:1px solid #000000;
border-width:0px 1px 1px 0px;
text-align:center;
padding:10px;
font-size:10px;
font-family:Arial;
font-weight:normal;
color:#000000;
}.CSSTableGenerator tr:last-child td{
border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child...