Tutorial : Navigation (ii)  

<style>
.navv {-webkit-transition: 1.0s;
-moz-transition: 1.0s;
margin:1px;
display:inline-block;
text-align:center;
background: #222;
color:#fff;
width:100px;
overflow: hidden;}
.navv:hover {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;-o-transition: all 1s ease;
transition: all 1s ease-in-out;}
#com {
margin-top: 27px;
width:100px;
padding:1px;
text-align:center;
position: absolute;
background:#FFf;
color:#222;
opacity: 0;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
transition: all 0.5s linear;z-index: 103;}
.navv:hover #com {opacity: 1;overflow:hidden;}</style>
<center><a href="link"><div class="navv"><div id="com">Tutorial</div>01</div></a>
<a href="link"><div class="navv"><div id="com">Freebies</div>02</div></a>
<a href="link"><div class="navv"><div id="com">Entries</div>03</div></a>
<a href="link"><div class="navv"><div id="com">Affiliates</div>04</div></a>
</center>