0

문제점

나는 2 키보드의 종류 (숫자, 숫자)하지만 난 내 스크립트를 테스트 할 때 IE 7에서 CSS와 상속 버그가 나타납니다와 키보드를 만들었습니다. 나는 키의 두 가지 유형을 분리하는 클래스 .backspace을 사용하지만 그들은 여전히 ​​.backspaceIE 7 - CSS 클래스 상속에 버그

코드에서 배경 위치를 상속

CSS 코드

key 

.keyboard-table.numeric .key-element{background-position: 5px -90px} 
.keyboard-table.numeric .key-element.keypressed{background-position: 5px -210px} 

.keyboard-table.numeric .backspace{ background-position: -295px -90px} 
.keyboard-table.numeric .backspace.keypressed{background-position: -295px -210px;} 

HTML 코드

<div class="keyboard-column"> 
    <span class="key-element" ascii-code="48" style="margin: 5px 0px 0px 5px; width: 300px; height: 112.5px;"> 
    0 
    </span> 
</div> 
<div class="keyboard-column"> 
    <span class="key-element backspace" style="margin: 5px 0px 0px 5px; width: 640px; height: 112.5px;"> 
    ← Apagar 
    </span> 
</div> 

어떻게이 버그를 해결할 수 있습니까?

답변

1

IE7이 side-by-side 형제 선택기를 지원하지 않는다고 생각합니다. 그래서 이들은 작동하지 않습니다 ...

.backspace.keypressed 

대신 키보드 컬럼에 .keypressed 후 사용 할 수 있습니다 ..

.keypressed .backspace 
+0

고맙습니다. 작품 –

0

IE7은 여러 클래스 선택을 지원합니다.

HTML에서 DOCTYPE을 사용하지 않는다고 생각하기 때문에 브라우저 렌더링이 원치 않는 모드 인 Quirks 모드로 전환됩니다.

당신은 단순히 당신의 HTML의 첫 번째 줄이를 추가해야합니다 :

<!DOCTYPE html> 

이것은 HTML5의 DOCTYPE이지만, 정말 문제, 그것은 IE7에서 잘 작동 트리거 표준 모드 대신합니다하지 않습니다 버크 모드.