HTML :
<div class='nav'> <ul class='menu' id='menu'> <!-- Start - Navigation Menu --> <li><a href='data:blog.homepageUrl'>HOME</a></li> <li><a href='#'>CATEGORY</a><ul> <li><a href='http://thelugastemplate.blogspot.com/search/label/Scenery?max-results=15'>SCENERY</a></li> <li><a href='http://thelugastemplate.blogspot.com/search/label/People?max-results=15'>PEOPLE</a></li> <li><a href='http://thelugastemplate.blogspot.com/search/label/Folks?max-results=15'>FOLKS</a></li> <li><a href='http://thelugastemplate.blogspot.com/search/label/Daily?max-results=15'>DAILY</a></li> </ul></li> <li><a href='http://thelugastemplate.blogspot.com/p/friends.html'>FRIENDS</a></li> <li><a href='http://thelugastemplate.blogspot.com/p/guest-book.html'>GUEST BOOK</a></li> <li><a href='http://thelugastemplate.blogspot.com/p/about.html'>ABOUT</a></li> <li><a href='http://thelugastemplate.blogspot.com/p/about-template.html'>ABOUT THE TEMPLATE</a></li> <li><span><a href='http://thelugastemplate.blogspot.com/p/contact.html'>CONTACT</a></span></li> <!-- End - Navigation Menu --> </ul> </div>

CSS
.nav{ width:100%; height:36px; background:#f9f9f9; border-top:1px solid #e4e4e4; border-bottom:1px solid #e4e4e4; box-shadow: 0 2px 2px #eee; forbidden1; }

.menu{ width:900px; list-style:none; font:10px Oswald,Arial,Verdana; text-align:center; margin:0 auto; }

.menu a{ float:left; color:#777; text-decoration:none; width:100px; line-height:36px; -moz-transition:.2s linear; -webkit-transition:.2s linear; transition:.2s linear; -o-transition:.2s linear; }

.menu a:hover,li.menuhover a{ color:#111; background:#efefef; -moz-transition:.2s linear; -webkit-transition:.2s linear; transition:.2s linear; -o-transition:.2s linear; }

.menu li,.menu li span{ position:relative; float:left; width:100px; forbidden2; border-left:1px solid #e3e3e3; }

.menu li span{ border-right:1px solid #e3e3e3; border-left:none; }

.menu ul{ display:none; position:absolute; font:normal 10px Oswald,Arial,Verdana; top:36px; left:0; background:#fbfbfb; display:none; list-style:none; box-shadow:0 2px 3px #ccc; }

.menu ul li{ float:none; border-top:1px solid #ccc; width:150px; }

.menu ul li a{ float:none; display:block; background:none; line-height:36px; width:137px; text-align:left; padding-left:10px; color:#444; }

.menu ul li a:hover{ background:#fefefe; color:#777; border-left:3px solid #a2354c; -moz-transition:none; -webkit-transition:none; -o-transition:none; transition:none; }