JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="menu">
	<li><a href="#">Home</a></li>
    <li><a href="#">About Us</a>
        <ul id="menu">
            <li>akhil</li>
            <li>mittal</li>
            
        </ul>
    
    </li>
    <li><a href="#">Products</a></li>
    <li><a href="#">FAQ's</a></li>
    <li><a href="#">Contact Us</a></li>
</ul>

CSS

#menu
{
	margin:0px;
	padding:0px;
	list-style:none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
}
#menu li
{
	float:left;
}
#menu li a
{
	display:block;
	height:40px;
	line-height:40px;
	color:#fff;
	background:#C60;
	text-decoration:none;
	padding:0px 20px;
}
#menu li a:hover
{
	background:#333;
}