JSFiddle - React, Tailwind, and code Playground

HTML

<table class="menu" cellspacing="0" cellpadding="0">
<tr>
<td><a class="menu_main" title="Главная страница" href="/">раз</a></td>
<td><a class="menu_popular" title="Популярное" href="#">два</a></td>
<td><a class="menu_allgames" title="Все игры" href="#">три</a></td>
<td><a class="menu_gallery" title="Галерея" href="#">четыре</a></td>
<td><a class="menu_forum" title="Форум" href="/forum">пять</a></td>
</tr>
</table>

CSS

table.menu {
margin-left: 100px;
margin-right: 100px;
 }

 
a.menu_main {
display: block;
text-align: right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_main:hover {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_forum {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_forum:hover {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_popular {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_popular:hover {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_allgames {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_allgames:hover {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_gallery {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }

a.menu_gallery:hover {
display: block;
text-align:right;
width: 208px;
height: 79px;
background: #ccc; }