JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://malsup.github.com/jquery.corner.js"></script>
<div id="new-menu-upper">
<ul id="top-nav">
<li><a href="/t-topnavlink.aspx">menu item 1</a></li>
<li><a href="/t-topnavlink.aspx">menu item 2</a></li>
<li><a href="/t-topnavlink.aspx">menu item 3</a></li>
<li><a href="/t-topnavlink.aspx">menu item 4</a></li>
<li><a href="/t-topnavlink.aspx">menu item 5</a></li>
<li><a href="/t-topnavlink.aspx">menu item 6</a></li>
</ul>
</div>
CSS
div#new-menu-upper {
border: 0 solid red;
height: 40px;
margin: 0 5px 10px;
padding-top: 63px;
}
ul#top-nav li {
background-image: url("http://i47.tinypic.com/21nqxjc.png");
background-repeat: repeat;
border-right: 2px solid lightgrey;
float: left;
height: 41px;
width: 156px;
}
ul#top-nav li a {
color: White;
display: inline-block;
font-family: Arial;
font-size: 12px;
font-weight: bold;
letter-spacing: 1px;
padding-left: 38px;
padding-top: 12px;
text-transform: uppercase;
}
JavaScript
$('ul#top-nav li:first').corner();