JSFiddle - React, Tailwind, and code Playground

by zerolfc

HTML

<div id="contextmenu">
    <ul>
        <li class="title">My Title</li>
        <li><a href="#">Bring Forward</a></li>
        <li><a href="#">Send  Backward</a></li>
    </ul>
</div>

CSS

#contextmenu {
    background-color:#fff;
    border:1px solid #ccc;
    position:absolute;
    left:20px;
    top:20px;
    min-width:100px;
    box-shadow: 2px 2px 5px #ccc;
    -webkit-box-shadow: 2px 2px 5px #ccc;
    border-radius:3px;
}

#contextmenu > ul {
    padding:0;
    margin:0;
    list-style:none;
}
#contextmenu > ul > li.title {
    background-color: rgb(95, 90, 95);
    color:#fff;
    padding:5px;
}

#contextmenu > ul > li > a {
    display:block;
    text-decoration:none;
    color:#333;
    padding:5px;
}
#contextmenu > ul > li > a:hover {
    background-color:#fafafa;
}