JSFiddle - React, Tailwind, and code Playground

by mustafa yılmaz

HTML

<div class="menu">
  <div class="icerik">ANASAYFA
    <ul class="altmenu">
      <li><a href="#">Yeni</a></li>
      <li><a href="#">Düzenle</a></li>
      <li><a href="#">Sil</a></li>
    </ul>
  </div>

</div>

CSS

body{font-family: sans-serif}
ul.altmenu{display: none;}

.icerik:hover>.altmenu{
  display: block;
}
ul,li{
  list-style: none;
  padding: 0;
}
a{margin: 5px; padding: 5px 20px; text-decoration: none; color: #eee;transition: all 300ms ease-out;}
a:hover{background: #eee; color: #333;}
.icerik{background: #888;  padding: 10px; width: 100px;}