JSFiddle - React, Tailwind, and code Playground

HTML

<div class="name">test</div >

<div id="menu">	
		<ul>
				<li><a href="index.php?menu=1" border="0" alt="menu1">menu1</a></li>
				<li><a href="index.php?menu=1" border="0" alt="menu1">menu2</a></li>
				<li><a href="index.php?menu=1" border="0" alt="menu1">menu3</a></li>
				<li><a href="index.php?menu=1" border="0" alt="menu1">menu4</a></li>
				<li><a href="index.php?menu=1" border="0" alt="menu1">menu5</a></li>
				
		</ul>
</div>


<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
test scroll
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
test scroll<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
test scroll

CSS

.name {
font-size: 12pt;
font-weight: bold;
height: 20px;
color: #ffffff ;
Width: 99%;
display:  ;
position:fixed;
z-index:2;
padding: 5px;
top: 2px;
}


#menu {
 background: #bbbbbb;
 top: 0px;
 height: 35px;
 width: 99.8% ;
 text-align: center ;
 position:fixed;
 z-index:1;
 }
 

}

#menu ul{
display: ;
height: auto;
padding: 8px 0px;
margin: 0px;
z-index:3;
}

#menu li {
display: inline;
z-index:3;
}
 
 
 
#menu a {
display: inline-block;
font-weight: bold;
font-size: 15px;
color: red;  
text-decoration: none;
vertical-align: bottom;  
padding: 20px; 

}