IE/Edge에서 CSS가 업데이트되지 않습니까?

Question

다음은 JsFiddle

내가 이웃의 표시 상태에 따라 CSS 규칙이있다 : 나는 숨기면

#top:not([style*="display: none"]) + #bottom { 
    color:red; 
} 

을 '#top'자바 스크립트, CSS 규칙부터 색상 변경을 사용하여 div에 더 이상 유효하지 않습니다. Internet Explorer 및 Edge에서는 그렇지 않습니다! 내가 잘못했거나 Microsoft의 브라우저에 버그가 있습니까?

Answer 1

나는이 접근법을 피해야합니다 (it's somewhat fragile). 대신, 명시 적으로 부모 요소 또는 #top에 클래스를 전환하고, 그에 따라 CSS 변경합니다

body.toggled #bottom { 
    color:red; 
} 
body.toggled #top { 
    display: none; 
} 

$("#btn").click(function() { 
    $('body').toggleClass('toggled'); 
}); 

Demo

을