Горизонтальное меню в стиле Vista

img{border: 0pt;}  

#vista_toolbar {  
float:left;  
font:normal 12px 'Trebuchet MS','Arial';  
margin:0;  
padding:0;  
}  
#vista_toolbar ul {  
background-image:url(back.gif);  
background-repeat:repeat-x;  
float:left;  
line-height:32px;  
list-style:none;  
margin:0;  
padding:0 10px 0 10px;  
width:500px;  
}  
#vista_toolbar li {  
display:inline;  
padding:0;  
}  
#vista_toolbar a {  
color:#FFF;  
float:left;  
padding:0 3px 0 3px;  
text-decoration:none;  
}  
#vista_toolbar a span {  
display:block;  
float:none;  
padding:0 10px 0 7px;  
}  
#vista_toolbar a span img {  
border:none;  
margin:8px 4px 0 0;  
}  
#vista_toolbar a:hover{  
background: url(left.png) no-repeat left center;  
}  
#vista_toolbar a:hover span {  
background:url(right.png) no-repeat right center;  
}  
#vista_toolbar a.right {  
float:right;  
}

<div id="vista_toolbar">  
<ul>  
<li><a href="#"><span><img align="left" src="add.gif" alt="Добавить" />Добавить</span></a></li>  
<li><a href="#"><span><img align="left" src="mail.gif" alt="Почта" />Почта</span></a></li>  
<li><a href="#"><span><img align="left" src="chart.gif" alt="Статистика" />Статистика</span></a></li>  
<li><a href="#"><span><img align="left" src="mona.gif" alt="Фотогалерея" />Фотогалерея</span></a></li>  
<li><a class="right" href="#"><span><img align="left" src="sos.gif" alt="Помощь" />Помощь</span></a></li>  
</ul>  
</div>