Windows에서 Chrome에서 맞춤 체크 박스가 작동하지 않습니다.

Question

CSS 및 이미지만으로 사용자 정의 확인란을 만들었습니다. 자바 스크립트가 없습니다. Chrome, Firefox, Windows 및 Safari의 IE, Chrome, Mac의 Firefox 등 많은 브라우저에서 수개월 동안 작업 해 왔습니다.

최근 Windows 용 Chrome이 작동하지 않습니다. 확인란을 클릭해도 아무런 변화가 없습니다.

나는 문제가 크롬 버전이 생각 : http://plnkr.co/edit/zUhrCJcLzeFxjkfFJfio?p=preview

어떤 아이디어 나 해결책 : 문제를 보여줍니다 여기 39.0.2171.65 m

Plnkr?

HTML :

<div> 
    <input id="cb1" type="checkbox"> 
    <label for="cb1">I am a checkbox.</label> 
</div> 

CSS :

input[type=checkbox]:not(old), 
input[type=radio]:not(old) { 
    position: absolute; 
    width: 28px; 
    height: 20px; 
    margin: 0; 
    padding: 0; 
    opacity: 0; 
    cursor: pointer; 
} 

input[type=checkbox]:not(old) + label, 
input[type=radio]:not(old) + label { 
    color: #8a8a8a; 
    font-size: 18px; 
    font-weight: 200; 
    padding-left: 28px; 
    background-image: url("https://lh6.googleusercontent.com/-nUA70hCTkQg/VHJw1D_AMQI/AAAAAAAAAtM/H2hV7zay0ZY/w34-h36-no/radio-unchecked.png"); 
    background-repeat: no-repeat; 
    line-height: 18px; 
} 

input[type=checkbox]:not(old):checked + label, 
input[type=radio]:not(old):checked + label { 
    background-image: url("https://lh3.googleusercontent.com/-Ej9nmrhevVg/VHJw1AxHuAI/AAAAAAAAAtI/UfonPHsJBMc/w34-h36-no/radio-checked.png"); 
} 

Answer 1

그것은 크롬 v39에서 버그가 밝혀되고있다. 자세한 내용은 여기를 참조하십시오 :

https://code.google.com/p/chromium/issues/detail?id=435923

당신은 다음 크롬 릴리스가 나올 때까지 기다리는 또는 RaianaLadeira의 제안 @ 사용할 수 있습니다.

Answer 2

난 그냥 똑같은 문제가 있었다. CSS

에서 의사 클래스의 순서를 inverteing이 해결이되었다 여기서

input[type=radio]:not(old):checked + label 

이

input[type=radio]:checked:not(old) + label