Today I am going to share awesome 3d design flip menu purely made with CSS, which you can use on your website, whenever you hover the menu it display an awesome 3d flip animation with submenu.

 <nav>
  <ol class="main-menu">
    <li class="main-item"><span class="home"></span></li>
    <li class="main-item"><span class="about"></span></li>
    <li class="main-item"><span class="widgets"></span>
      <ol class="sub-menu">
        <li class="sub-item item-left"><span class="small"></span></li>
        <li class="sub-item item-left"><span class="standart"></span></li>
        <li class="sub-item item-left"><span class="big"></span></li>
      </ol>
    </li>
    <li class="main-item"><span class="kabobs"></span>
      <ol class="sub-menu">
        <li class="sub-item item-right"><span class="premium"></span></li>
        <li class="sub-item item-right"><span class="combo"></span></li>
        <li class="sub-item item-right"><span class="special"></span></li>
      </ol>
    </li>
    <li class="main-item"><span class="contact"></span></li>
  </ol>
</nav>
<a class="me" href="https://codepen.io/uzcho_/pens/popular/?grid_type=list" target="_blank" style="color:#000" rel="noopener noreferrer"></a>

#css & css3 #html #css