CSS Code
#navbar {font:bold .76em Tahoma, Arial, sans-serif;width:100%;float:left;margin:0;padding:0;background:url(bgnavhr04.gif) repeat-x;}
#navbar ul {margin:0;padding:0 0 0 10px;list-style:none;}
#navlist li {float:left;list-style:none;}
#navlist li a {float:left; display:block;margin:0;padding:0 0 0 14px;background:url(bgnavhr04-btn.gif) left top;text-decoration:none;cursor:pointer;}
#navlist li a span {float:left;color:#ccc;display:block;margin:0;padding:10px 18px 10px 4px;background:url(bgnavhr04-btn.gif) right top;}
#navlist li a:hover, #navlist li #current {background:url(bgnavhr04-hvr.gif);}
#navlist li a:hover span, #navlist li #current span {color:#fff; background:url(bgnavhr04-hvr.gif) right top;}
HTML Code
<div id="navbar">
<ul id="navlist">
<li><a href="#" id="current"><span>Menu List 01</span></a></li>
<li><a href="#"><span>Menu List 02</span></a></li>
<li><a href="#"><span>Menu List 03</span></a></li>
<li><a href="#"><span>Menu List 04</span></a></li>
<li><a href="#"><span>Menu List 05</span></a></li>
<li><a href="#"><span>Menu List 06</span></a></li>
</ul>
</div>