Vertical Menus - CSS + Images 01.

CSS Code

#sidebar {font:bold .76em Tahoma, Arial, sans-serif;margin:0;padding:0;}
#sidebar ul, .menulist li {list-style:none;margin:0;padding:0;}
.menulist {width:20%;margin:0;padding:0;border:1px solid #94AA74;border-width:0 1px 1px 1px;}
.menulist li a {height:20px;text-decoration:none;}	
.menulist li a:link, .menulist li a:visited {color:#000;display:block;background:url(bgnavver01.gif);padding:6px 0 0 10px;}
.menulist li a:hover {color:#fff;background:url(bgnavver01.gif) 0 -26px;padding:6px 0 0 10px;}
.menulist li a:active {color:#000;background:url(bgnavver01.gif) 0 -52px;padding:6px 0 0 10px;}

HTML Code

<div id="sidebar">
	<ul class="menulist">
		<li><a href="#" id="current">Menu List 01</a></li>
		<li><a href="#">Menu List 02</a></li>
		<li><a href="#">Menu List 03</a></li>
		<li><a href="#">Menu List 04</a></li>
		<li><a href="#">Menu List 05</a></li>
		<li><a href="#">Menu List 06</a></li>
	</ul>
</div>