JSFiddle - React, Tailwind, and code Playground

by thilakar

HTML

<ul>
<li><a>1</a>
<ul>
    <li><a>1.1</a></li>
    <li><a>1.2</a></li>
    </ul>
</li>
<li><a>2</a></li>
<li><a>3</a></li>
</ul>

CSS

ul {margin:0px; padding:0px;}
ul li {list-style-type:none; float:left; padding:0px 10px 0px 10px; position:relative}
ul li:hover a {color:#ff0000;}
ul li ul {display:none;}
ul li:hover ul {display:block; position:absolute; top:20px; left:0px;}
ul li:hover ul li {float:none; padding:5px 0px 5px 0px;}