JSFiddle - React, Tailwind, and code Playground

HTML

<table cellspacing="5">
<tr>
<td align="right" valign="bottom" bgcolor="#083365" width="80" height="170">
    <a href="#" class="foo">Link<br>One</a>
</td>
    
<td align="right" valign="bottom" bgcolor="#073b77" width="80" height="170">
    <a href="#" class="foo">Link<br>One</a>
</td>
    
<td align="right" valign="bottom" bgcolor="#06448a" width="80" height="170">
    <a href="#" class="foo">Link<br>One</a>
</td>
    
<td align="right" valign="bottom" bgcolor="#064a97" width="80" height="170">
    <a href="#" class="foo">Link<br>One</a>
</td>
    
<td align="right" valign="bottom" bgcolor="#0552a7" width="80" height="170">
    <a href="#" class="foo">Link<br>One</a>
</td
</tr>
</table>

CSS

a.foo:link 
{
    font-size       : 13px; 
    color           : #e0e0e0;        
    font-family     : Calibri;        
    text-decoration : none;     
} 

a.foo:visited 
{        
    font-size       : 13px;         
    color           : #e0e0e0;        
    font-family     : Calibri;        
    text-decoration : none; 
} 

a.foo:hover  
{     
    font-size       : 13px;      
    color           : #ffffff;     
    font-family     : Calibri;     
    text-decoration : none;         
}