title: Remove top border of first child and bottom border of last child in CSS
body: <p>I have the following HTML:</p>
  
  <pre><code>&lt;ul&gt;
  &lt;li&gt;FIRST&lt;/li&gt;
  &lt;li&gt;SECOND&lt;/li&gt;
  &lt;li&gt;THIRD&lt;/li&gt;
  &lt;li&gt;FOURTH&lt;/li&gt;
  &lt;ul&gt;
  </code></pre>
  
  <p>And the following CSS:</p>
  
  <pre><code>li
  {
   border-top:1px solid #FFF;
   border-bottom: 1px solid #D0D0D0;       
  }​
  </code></pre>
  
  <p>How can I remove the top border for the first LI element, and the bottom border for the last LI element?
      ​</p>