JSFiddle - React, Tailwind, and code Playground

HTML

<div id="mainmenu">
                                        <ul>
                                            <li> <a href=""><h1>My Dashboard</h1></a></li><br>
                                            <li> <a href=""><h1>About</h1></a></li><br>
                                            <li> <a href=""><h1>Contact</h1></a></li><br>
                                            <li> <a href=""><h1>Setttings</h1></a></li><br>
                                            <li> <a href=""><h1>Log Out</h1></a></li><br>
                                        </ul>
                                    </div>

CSS

*{
    font-family:Arial;
    font-size:1rem;
    list-style:none;
}
#mainmenu {
    position:absolute;
    top: 20px;
    right: 10px;
    background-color:grey;
    width:300px;
    height: auto;
}

#mainmenu ul li a{

}

#mainmenu ul li a:hover{

    
}