title: How do i add a style to a specific list element, i.e. single <li> inside <nav> in this?
body: <p>I have a problem regarding <strong>CSS</strong> styling for my list.</p>
  
  <p>Here is the code.</p>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>NAV {
  width: 940px;
  height: 50px;
  float: left;
  font-family: Geneva,Arial;
  border: 1px solid #000000;
  background-color: #D0DBF0;}
  
  NAV ul {
      margin: 0px auto;
      padding-top: 15px;
          padding-left: 70px;
      list-style-type: none;
  }
  NAV li {
      display: inline;
  
  }
  
  NAV li a {
      float: left;
      text-align: center;
      border-right: 2px solid #00DBF0;
      width: 100px;  
      font-size: 14px; 
      padding: 0px 10px;
      color: #0000FF;
      text-decoration: none;
  }
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;NAV&gt;
          &lt;UL&gt;
              &lt;LI&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/LI&gt;
              &lt;LI&gt;&lt;a href="#"&gt;About Us&lt;/a&gt;&lt;/LI&gt;
              &lt;LI&gt;&lt;a href="#"&gt;Contact Us&lt;/a&gt;&lt;/LI&gt;
              &lt;LI&gt;&lt;a href="#"&gt;Red Widgets&lt;/a&gt;&lt;/LI&gt;
              &lt;LI&gt;&lt;a href="#"&gt;Blue Widgets&lt;/a&gt;&lt;/LI&gt;
              &lt;LI&gt;&lt;a href="#"&gt;Green Widgets&lt;/a&gt;&lt;/LI&gt;
          &lt;/UL&gt;
      &lt;/NAV&gt;
  </code></pre>
  
  <p>So here i have designed everything for navigation list, but for the first list i.e home.</p>
  
  <p><code>&lt;LI&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/LI&gt;</code> i want right border. please help me.</p>