sliding door tabbed navigation | Rounded corner

Here we use wo images one- is rectangular box and another is curved box. This could have been achieved using rounded property of css3 as well?

by prasun_sultania

HTML

<ul class="nav">
    <li><a href="home.htm">Home</a></li>
    <li><a href="about.htm">About</a></li>
    <li><a href="news.htm">News</a></li>
    <li><a href="products.htm">Products</a></li>
    <li><a href="services.htm">Services</a></li>
    <li><a href="clients.htm">Clients</a></li>
    <li><a href="case-studies.htm">Case Studies</a></li>
</ul>

CSS

ul.nav {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 72em;
    overflow: hidden;
}

ul.nav li {
    float: left;
    background: url(http://www.mediafire.com/conv/cbad12b3541f013fbdbf59e27e0364f5f871b9d9bd92a1010dc2d7fcf243e2ab6g.jpg) no-repeat right top;
}

ul.nav li a {
    display: block;
    padding: 0 2em;
    line-height: 2.5em;
    background: url(http://www.mediafire.com/conv/488f8e1056524833c9ae42af69356ea8240e1befc4eea36bbc34be2e6a5a5cf86g.jpg) no-repeat left top;
    text-decoration: none;
    color: #fff;
    float: left;
}

ul.nav a:hover, ul.nav a:focus {
    color: #333;
}