JSFiddle - React, Tailwind, and code Playground

HTML

<table id="nav">
    <tbody>
        <tr>
            <td onclick="document.location = '#';"><a href="#">Новости</a></td>
            <td onclick="document.location = '#';"><a href="#">Информация</a></td>
            <td onclick="document.location = '#';"><a href="#">Документы</a></td>
            <td onclick="document.location = '#';"><a href="#">Контакты</a></td>
        </tr>
    </tbody>
</table>

CSS

#nav {
    background-color: #3f6738;
    width: 100%;
    margin: 0px;
    padding: 0px;
    border: 0px;
    font-weight: bold;
    font-size: 17px;
}
#nav td {
    text-align: center;
    margin: 0px;
    padding: 10px;
    cursor: pointer;
}
#nav td:hover {
    background-color: #4a7b43;
}
#nav a {
    color: #f2e8c9;