가로 방향 탐색에 스프라이트 사용

Question

다음 코드가 있는데 첫 번째 navA에서 역할이 바뀌면 아무 것도 바뀌지 않지만 꽤 있어야한다고 확신 할 수없는 이유는 무엇입니까?

HTML

<div id="access" role="navigation"> 
     <ul> 
      <li id="navA"><a href="http://localhost:8888/fiftyfity/?page_id=2"></a></li> 
      <li id="navB"><a href="http://localhost:8888/fiftyfity/?page_id=9"></a></li> 
      <li id="navC"><a href="http://localhost:8888/fiftyfity/?page_id=11"></a></li> 
      <li id="navD"><a href="http://localhost:8888/fiftyfity/?page_id=13"></a></li> 
     </ul> 
    </div><!-- #access --> 

CSS

#access { 
    background-image: url("../images/mainNav.gif"); 
    width: 521px; 
    height: 49px; 
    margin: 0; 
    padding: 0; 
} 

#access li, #access a { 
    height: 49px; 
    display: block; 
} 

#access li { 
    float: left; 
    list-style: none; 
    display: inline; 
    text-indent: -9999em; 
} 

#navA { width: 98px; } 
#navB { width: 131px; } 
#navC { width: 123px; } 
#navD { width: 138px; } 

#navA a:hover { background-image: url("../images/mainNav.gif") 0px -49px no-repeat; } 

Answer 1

문제는 #navA a:hover 선택의 선언입니다. 이 시도 :

#navA a:hover 
{ 
    background: url("../images/mainNav.gif") no-repeat 0px -49px; 
}