Some border-radius and text-shadow testing...
<ul>
<li><a href="#1">Item one</a></li>
<li><a href="#2">Item number two</a></li>
<li><a href="#3">And there is another item in this list</a></li>
</ul>
ul {
list-style: none;
margin: 0;
padding: 0;
}
li {
line-height: 2em;
}
ul li a {
background-color: #ccc;
-moz-border-radius: 0.5em;
-webkit-border-radius: 0.5em;
border-radius: 0.5em;
text-shadow: 1px 1px 2px #363636;
color: #fff;
text-decoration: none;
padding: 0.25em 1em;
}
ul li a:hover {
background: #363636;
text-shadow: 1px 1px #000;
}
ul li a:active {
color: #ccc;
}