Today there are many blogs with full menu for very detailed design is eye catching. But most of the menu that will include many categories. So today I see a menu looked very good also. <style> #bt4unavmenu{height:46px;display:block;overflow:hidden;padding:5px 0;margin-bottom:6px;border:1px solid #333;-moz-border-radius:07px; -khtml-border-radius:07px;-moz-border-radius:15px; -khtml-border-radius:15px;box-shadow:0px 0px 15px #252525; -webkit-box-shadow:0px 0px 10px #252525; -moz-box-shadow: 0px 0px 10px #252525;background:#222 url() left top repeat-x} #bt4unavmenu .current-cat a{background:#dc0000 url() top left repeat-x;color:#FFF;-moz-border-radius:15px; -khtml-border-radius:15px;border:1px solid #111} #bt4unav a,#subMenusContainer a{text-decoration:none;display:block} #bt4unav a{margin:0;float:left;background:none;padding:15px 15px 15px 15px;color:#fff;text-transform:uppercase;font-weight:bold;font-size:12px;border:1px solid #222} #bt4unav li a:hover,#bt4unav li a:focus,#bt4unav a.mainMenuParentBtnFocused{background:#8eda22 url() top left repeat-x;color:#fff;-moz-border-radius:15px; -khtml-border-radius:15px;border:1px solid #333} #bt4unav,#bt4unav ul,#bt4unav ol,#subMenusContainer ul,#subMenusContainer ol{padding:0;margin:0;list-style:none;line-height:1em} #bt4unav ol,#bt4unav ul,#subMenusContainer ul,#subMenusContainer ol{background:none;left:0} #bt4unav li{cursor:pointer;float:left;margin:0 2px 0 0;padding:0 2px 0 4px;height:44px;display:inline;background:url() left center no-repeat} #bt4unav li:first-child{background:none;padding:0 2px 0 0} #bt4unav{width:940px;margin:0 auto;clear:both;overflow:hidden;font-size:12px;display:block} </style> <div id='bt4unavmenu'> <ul id='bt4unav'> <li class='current-cat'><a href='http://www.cloudmedianews.com/'>Home</a></li> <li><a href='#'>Cloud OS</a></li> <li><a href='#'>Cloud Office</a></li> <li><a href='#'>Cloud Security</a></li> <li><a href='#'>Social Network</a></li> <li><a href='#'>Tips</a></li> <li><a href='#'>News</a></li> <li><a href='#'>Contact Us</a></li> </ul> </div> </div> Code (markup): Note: You need to edit the code accordingly. Source: http://forum.cloudmedianews.com/programming-coding/share-nice-horizontal-menu-t1076.html