title: css3 first-child in anchor of list items
body: <pre><code>&lt;style type="text/css"&gt;
  #featured a:first-child
  {
   background-color:yellow;
  }
  &lt;/style&gt;
  
  &lt;div id="featured"&gt;
     &lt;ul class="ui-tabs-nav"&gt;
       &lt;li&gt;&lt;a href="#"&gt;&lt;span&gt;test 1&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
       &lt;li&gt;&lt;a href="#"&gt;&lt;span&gt;test 2&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
       &lt;li&gt;&lt;a href="#"&gt;&lt;span&gt;test 3&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
       &lt;li&gt;&lt;a href="#"&gt;&lt;span&gt;test 4&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
     &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I wanted to highlight first anchor from the list, but unfortunately all anchors are highlighted. What is the mistake do here.</p>