JSFiddle - React, Tailwind, and code Playground

by Milos Maric

HTML

<div id="meni">
 <ul>
	<li><a href="#">Administracija</a></li>
	<li><a href="#">OM</a></li>
	<li><a href="#" class="hr">HR</a></li>
	<li><a href="#" class="bzr">BZR</a></li>
    <li><a href="#" class="zop">ZOP</a></li>
  </ul>
</div>

CSS

#meni {
    display: block;
    float: left;
    background-color:#EAEAEA;
}

#meni ul, #meni li{
	float:left;
	list-style: none outside none;
	margin:0px ;
	padding:0px 20px;

}

#meni li a:link, #meni li a:visited, #meni li a:hover{
	display:block;
	padding:10px 20px;
	}

	
#meni ul ul li a:link, #meni ul ul li a:visited{
	border:none;
	}

#meni li.last a{
	margin-right:0;
	}

#meni li a:hover{
	color:#0070C0;
	background-color:#FCC846;
	}
#meni li li a:active{
	color:#0070C0;
	background-color:#FCC846;
	}
	
#meni li li a:link, #meni li li a:visited{
	width:150px;
	float:none;
	margin:0;
	padding:7px 10px;
	font-size:12px;
	font-weight:normal;
	color:#FFFFFF;
	background-color:#333333;
	}
	
#meni li li a:hover{
	color:#0070C0;
	}

#meni li ul{
	z-index:9999;
	position:absolute;
	left:-999em;
	height:auto;
	width:170px;
	border-left:1px solid #CCCCCC;
	border-bottom:1px solid #CCCCCC;
	}

#meni li ul a{width:140px;}

#meni li ul ul{margin:-32px 0 0 0;}

#meni li:hover ul ul{left:-999em;}

#meni li:hover ul, #meni li li:hover ul{left:auto;}

#meni li:hover{position:static;}

#meni li.last a{margin-right:0;}


#meni li.help a{
	margin-right:0;
	color: #B0D661;
}