JSFiddle - React, Tailwind, and code Playground

HTML

<table cellspacing="0" cellpadding="0">
  <thead>
    <tr>
      <td>A</td>
      <td>B</td>
      
    </tr>
  </thead>
  <tbody>
    <tr>
        <td><a href="http://www.google.com.br" target="_blank">Conteudo</a></td>
        <td><a href="http://www.google.com.br" target="_blank">#fff</a></td>
        <td><a href="http://www.google.com.br" target="_blank">#fff</a></td>
    </tr>
    <tr>
        <td> <a href="http://www.bing.com.br" target="_blank">Conteudo2</a></td>
        <td><a href="http://www.bing.com.br" target="_blank">#fff</a></td>
        <td><a href="http://www.bing.com.br" target="_blank">#fff</a></td>
    </tr>
  </tbody>
  
</table>

CSS

table thead td{
 padding: 2px 12px;
 background-color: #eee;
}

table td{
  border: 1px solid #ccc;
  width: 100px;
}

table td a{
  width: 100%;
  float:left;
  padding: 4px 12px;
  text-decoration: none;
  color: #000;
}

table tbody tr:hover td{
  background-color: #d4ebff;
}