css - Styling ul with first-child -

i'm sure shouldn't difficult solve can't styling ul work (trying different things, either works one, or none @ all) , i'm tear hair out. have missed?

https://jsfiddle.net/5cuuq8rq/

html:

<ul class="nav">    <li><a href="?page=home">home</a></li>    <li><a href="?page=couriers">couriers</a></li>    <li><a href="?page=reviews">reviews</a></li>    <li><a href="?page=retailers">retailers</a></li>    <li><a href="?page=about">about</a></li> </ul> 

css:

.nav{    font-size:18px;  font-weight: bold; list-style:none; margin:0; padding:0; text-align:center; }  .nav li{ display:inline;  }  .nav a{ width: 144px; background: -webkit-linear-gradient(rgb(256,256,256), rgb(175,175,175)); background:    -moz-linear-gradient(rgb(256,256,256), rgb(175,175,175)); background:         linear-gradient(rgb(256,256,256), rgb(175,175,175)); text-decoration:none; display:inline-block; padding:10px;  }   .nav li > a:first-child { border-radius: 20px 0px 0px 0px; } 

instead of this

.nav li > a:first-child {     border-radius: 20px 0px 0px 0px; } 

use it

.nav li:first-child > {     border-radius: 20px 0px 0px 0px; }