JSFiddle - React, Tailwind, and code Playground
HTML
<div id="main">
<div class="divAmUl">
<ul class="amUl">
<li>test1test1</li>
<li>test2test2</li>
<li>test3test3</li>
</ul>
</div>
</div
CSS
.divAmUl{
position: relative;
padding:0;
margin:0;
width:100px;
z-index:0;
border:1px solid #a6c9e2;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color:white;
}
.amUl{
margin:0;
list-style:none;
padding:4px;
cursor:pointer;
}
.amUl li{
font-size:12px;
font-decoration:none;
}
.amUl li:hover{
background-color: #95d1ff;
}
#main{
padding:20px;
border:1px solid black;
width:300px;
height:20px;
}
JavaScript
$("#main").resizable({
handles :'s'
});