웹 키트, CSS 클립 강제 스크롤바

Question

링크가있는 큰 스프라이트 이미지가 있는데 링크에는 부모 속성이 있고 이미지에는 자식 속성이 있습니다.

css 클립 기술을 사용하여 특정 이미지를 가져옵니다. 하지만, 내 크롬 브라우저에서 나는 위치 내 자식 요소 절대하고 그것을 의수평/수직 스크롤을 위해 브라우저를 일으키는 가려진 오버 플로우를 제공하는이 있어도.

.parent{ 
    margin-top: 10px; 
    text-decoration: none; 
    display: block; 

} 
.child { 
    border: 0; 
    position: absolute; 
    margin-top: -154px; 
    clip: rect(152px, 296px, 234px, 0px); 
    float: left; 
    overflow: hidden; 
} 

사용법 : <a href="/" class="parent"> <img src="largeImage.png" class="child" /> </a>

이 overflow 속성의 넘치는 부분의 내용을 숨기하기 위해 부모 요소에 hidden로 설정해야합니다 8. ​​

Answer 1

파이어 폭스와 인터넷 익스플로러에서 잘 작동 그 자식 요소.

는 (제외 : overflow 블록 컨테이너 요소에 영향을 미치는, 난 아무것도 경우 다른 요소를 어떻게 해야하는지 잘 모르겠어요 자세한 내용은 여기를 참조하십시오 : http://www.w3.org/TR/CSS21/visufx.html#overflow-clipping를.)

귀하의 CSS를 업데이트 :

.parent{ 
    margin-top: 10px; 
    text-decoration: none; 
    display: block; 
    overflow: hidden; 
} 

.child { 
    border: 0; 
    position: absolute; 
    margin-top: -154px; 
    clip: rect(152px, 296px, 234px, 0px); 
    float: left; 
}