title: Why this li:last-child is not working for my unordered list?
body: <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.navbar-nav{
            margin: 0 auto;
            display: table;
            table-layout: fixed;
            float:none;
        }
  
        .navbar-collapse ul li a {
          border-right: 1px solid #c0c0c0;
          padding: 0 10px;
          margin-top:15px;
        }
         .navbar-collapse ul li:last-child {
          border:none;
        }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
            &lt;ul class="nav navbar-nav"&gt; 
              &lt;li&gt;&lt;a href="#"&gt;MANUALS&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;NEWS&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;SPARE PART&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;WHERE TO BUY&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;SUPPORT&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;EDIT BOOK&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;ADMIN&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I need git rid off my right border of last li item.I set border:none for li:last-child but not working.</p>
  
  <p>Anything I miss? </p>