title: Links not displaying links
body: <p>I have created a navigation menu and was wondering why is it when I hovered over the li item containing the link the link does not display?</p>
  
  <p>Here is my Html containing the links</p>
  
  <pre><code>&lt;ul id="nav"&gt;
              &lt;li class="nav-button" id="home"&gt;&lt;a href="Index.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="whatIs1031"&gt;&lt;a href="whatIs1031.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="exchange1031"&gt;&lt;a href="exchangeRequ.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="typesOfExchange"&gt;&lt;a href="typesOfExchange.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="whyCLX"&gt;&lt;a href="howToStart.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="howToStart"&gt;&lt;a href="whyCLX.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="resources"&gt;&lt;a href="resources.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="faq"&gt;&lt;a href="fAQs.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="fee"&gt;&lt;a href="fees.html"&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li class="nav-button" id="contactUs"&gt;&lt;a href="contactUs.html"&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
  </code></pre>
  
  <p>Here is my css which contains a refrences to a sprite which shows each list item.</p>
  
  <pre><code>#home, #home, #whatIs1031, #exchange1031, #typesOfExchange, #h-typesOfExchange, #whyCLX, #h-whyCLX, #howToStart, #resources, #h-resources, #faq, #h-faq, #fee, #h-fee, #contactUs, #h-contactUs{
      background: url(http://i1287.photobucket.com/albums/a634/debuggingfool/nav_zps03a73d67.png) no-repeat;
      width: 225px;
      height: 30px;
  }
  
  #home:hover{
      background-position: -222px 0;
  }
  
  #home{
      background-position: 0 0;
  }
  
  #whatIs1031{
      background-position: 0 -36px;
  }
  
  #whatIs1031:hover{
      background-position: -223px -36px;
  }
  
  #exchange1031{
      background-position: 0 -72px;
  }
  
  #exchange1031:hover{
      background-position: -224px -73px;
  }
  
  #typesOfExchange{
      background-position: 0 -111px;
  }
  
  #typesOfExchange:hover{
      background-position: -226px -112px;
  }
  
  #whyCLX:hover{
      background-position: -227px -150px;
  }
  
  #whyCLX{
      background-position: 0 -150px;
  }
  
  #howToStart{
      background-position: 0 -190px;
  }
  
  #howToStart:hover{
      background-position: -230px -189px;
  }
  
  #resources:hover{
      background-position: -230px -226px;
  }
  
  #resources{
      background-position: 0 -227px ;
  }
  
  #faq{
      background-position: 0 -264px ;
  }
  
  #faq:hover{
      background-position: -230px -263px ;
  }
  
  #fee{
      background-position: 0 -302px ;
  }
  
  #fee:hover{
      background-position: -231px -300px ;
  }
  
  #contactUs{
      background-position: 0 -341px ;
  }
  </code></pre>
  
  <p>Edit: Here is a demo page on code pen <a href="http://codepen.io/Austin-Davis/pen/Fdhej" rel="nofollow">http://codepen.io/Austin-Davis/pen/Fdhej</a></p>