title: unnecessary space on left side in nav
body: <p>I have a space beetwin my nav link it about 2px and i cant remove it, is it anny css code that can do it?</p>
  
  <p>When you hover over Downloads you can see the space on left side.</p>
  
  <p>jsFIDDLE:<a href="http://jsfiddle.net/asRz3/1/" rel="nofollow">http://jsfiddle.net/asRz3/1/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;?php
  ?&gt;
  &lt;!DOCTYPE&gt;
  &lt;html&gt;
  &lt;head&gt; 
      &lt;!--- START Styles ---&gt;
      &lt;link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet"&gt;
      &lt;link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"&gt;
      &lt;link rel="stylesheet" href="css/bootstrap.css" type="text/css"/&gt;
      &lt;link rel="stylesheet" href="index.css" type="text/css" /&gt;
      &lt;!--- END Styles ---&gt;
      &lt;!--- START Scripts ---&gt;
      &lt;script type="text/javascript" src"js/bootstrap.js"&gt;&lt;/script&gt;
      &lt;!--- END Scripts ---&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;!--- NavBar TOP ---&gt;
      &lt;nav class="navbar navbar-custom" role="navigation"&gt;
              &lt;a href="#" class="navbar-menu"&gt;F.A.Q's&lt;/a&gt;
              &lt;a href="#" class="navbar-menu2"&gt;Latest News&lt;/a&gt;
              &lt;a href="#" class="navbar-menu2"&gt;Downloads&lt;/a&gt;
              &lt;a href="#" class="navbar-menu2"&gt;Client Login&lt;/a&gt;
              &lt;a href="#" class="navbar-menu2"&gt;Contact Us&lt;/a&gt;
      &lt;/nav&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.navbar-custom {
      background-image: url('img/navbar-custom.png');
      height: 60px;
      border-radius: 0px;
      margin-bottom: 0px;
  }
  .left-nav-space {
      height: 70px;
      width: 200px;   
  }
  .navbar-menu {
      height: 59px;
      padding-left: 10px;
      padding-right: 10px;
      font-weight: 900;
      font-size: 12px;
      position: relative;
      display:inline-block;
      color: #FFF;
      padding-top: 20px;
      list-style: none;
      padding-bottom: 24px;
      text-align: center; 
      border-right: 2px solid #282828;
      border-left: 2px solid #282828;
      text-decoration: none !important;
  }
  .navbar-menu:hover {
      background-image: url('img/navbar-menu-hover.png');
  }
  .navbar-menu2 {
      height: 59px;
      padding-left: 10px;
      padding-right: 10px;
      font-weight: 900;   
      font-size: 12px;
      position: relative;
      display: inline;
      list-style: none;
      color: #FFF;
      padding-top: 20px;
      padding-bottom: 24px;
      text-align: center; 
      border-right: 2px solid #282828;
      text-decoration: none !important;
  }
  .navbar-menu2:hover {
      background-image: url('img/navbar-menu-hover.png');
  
  }
  </code></pre>