JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu">
                    <ul class="css-menu-2">
                        <li><a href="#" class="current"><span>Главная</span></a></li>
                        <li><a href="#"><span>О Нас</span></a></li>
                        <li><a href="#"><span>Услуги</span></a></li>
                        <li><a href="#"><span>Контакты</span></a></li>
                    </ul>
                </div><!-- меню закончилось -->

CSS

@import url("reset.css");
@import url("main.css");
/*General Styles*/

ul.css-menu-2 {
list-style: none;
border-bottom: 1px #888899 solid;
padding-bottom: 7px;
margin:50px 0 0 20px;
}

ul.css-menu-2 li {
display: inline;
margin-right: 5px;
}

ul.css-menu-2 li a {
color: #000;
font-weight:bold;
text-decoration: none;
background: #a5dbf5;
border: 1px #000 solid;
border-bottom: none;
padding: 10px 14px;
}

ul.css-menu-2 li a:hover {
padding: 14px 14px 10px 14px;
}

ul.css-menu-2 li a.selected {
color: #555566;
background: #ffffff;
border: 1px #888899 solid;
border-bottom: 1px #ffffff solid;
padding: 14px 14px 10px 14px;
}