Css menu submenu horizontal

How can I create css menu and submenu like this.

When I click or move my mouse over the menu, it has a small icon at the bottom

enter image description here

+3


source to share


1 answer


Html

<ul class="nav">
   <li><a href=#><span>Main item text</span><span class="bullet"></span></a>
      <ul>
        <li><a href=#><span>Sub item text</span><span class="bullet"></span></a></li>
      </ul>
   </li>
</ul>

      

CSS



ul.nav li ul { position: absolute; display: none; }
ul.nav li { float: left; }
ul.nav li:hover ul { display: block; }

      

Also, you must make the list correctly. You can try how it works with bullet here http://jsfiddle.net/9r4Lf/1/

+3


source







All Articles