title: a:hover background-postition problem
body: <p>For some reason, I am not entirely sure why, but the following is not working. The background position simply stays the same on hover. I cannot figure out why. I could do it another way, but I would like to try and get to the bottom of why it does not work. </p>
  
  <pre><code>#nav a:link, #nav a:visited {
      background:url(../img/nav-sprite.png) no-repeat;
      display:block;
      float:left;
      height:200px;
      padding:10px;
      text-indent:-9999px;
      border:solid 1px red;
  }
  
      #nav a#home {
          background-position:-10px 0px;
          width:30px;
      }
      #nav a#about-us {
          background-position:-85px 0px;
          width:45px;
      }
  
  #nav a:hover    {
      background-position:1px -15px;
  }
  </code></pre>
  
  <p>Does anybody know what could be causing this? </p>
  
  <p>Thanks in advance!</p>
  
  <p>Ryan</p>