JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu-top-container">
<ul id="menu-top" class="top_menu">


<li id="menu-item-156551" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-156551"><a href="#">Новости</a>
<ul class="sub-menu">
	<li id="menu-item-156552" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156552"><a href="#">Город</a></li>
	<li id="menu-item-156553" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156553"><a href="#">Происшествия</a></li>
	<li id="menu-item-156555" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156555"><a href="#">Дороги</a></li>
	<li id="menu-item-156557" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156557"><a href="#">Ленинградская область</a></li>
</ul>
</li>

<li id="menu-item-156559" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-156559"><a href="#">Фотобанк</a>
<ul class="sub-menu">
	<li id="menu-item-156560" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156560"><a href="#">Организации</a></li>
	<li id="menu-item-156556" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156556"><a href="#">Транспорт</a></li>
	<li id="menu-item-156558" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156558"><a href="#">Разное</a></li>
	<li id="menu-item-156554" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-156554"><a href="#">Строительство</a></li>
</ul>
</li>


</ul>
</div>

CSS

.top_menu li {
    border-right: 1px solid #B5C5D1;
    display: inline-block;
    height: 21px;
    margin-bottom: 7px;
    margin-top: 7px;
    padding-left: 17px;
    padding-right: 12px;
}
.top_menu {
    background-color: #EDF6FC;
    border-bottom: 1px solid #C2CBD4;
    height: 68px;
    margin-bottom: 17px;
    margin-left: 10px;
    width: 1180px;
} 




.menu-top-container{
 position:relative;
 }
.sub-menu{ 
left: 9px;
    position: absolute;
    top: 29px;
	display:none;
	 width: 800px;
height: 20px;

}
.sub-menu li {
border-right:none;
display:inline-block;}
.sub-menu li a{
text-decoration:none;

}
.sub-menu a{text-decoration:none;}
.sub-menu:hover{
text-decoration:underline;


}
ul.sub-menu li:active,.top_menu li a:active{
    background-color:green;

}

JavaScript

jQuery(document).ready(function($) {

$(document).ready(function(){
 $('ul.top_menu a').mouseover(function(){
  $(this).next().slideDown('slow');
 })
 .mouseout(function(){

 });
 $('ul.sub-menu').mouseleave(function(){
  $(this).slideUp('slow');
 });
});
		});