다른 바보 같은 질문 인 것처럼 보일 수도 있지만 답변을 찾을 수 없습니다.CSS 규칙을 브라우저에서 건너 뛰었습니다
#Navigation .stretch {
...
}
는 그래서됩니다 :
여기에 CSS 선언에 #Navigation을 제거
는 this 바이올린을 참조
.stretch {
...
}
왜 브라우저 (크롬 버전 26.0.1410.64 m)이 규칙을 무시 ?
나는 또한 firefox에서 테스트를 마쳤습니다.
아마도 DevTools와 FireBug 모두 CSS 우선 순위 문제가 아니기 때문에 CSS 우선 순위 문제가 아닙니다. 심지어 겹쳐지지 않습니다.
감사합니다.
편집 : 많은 분들께 감사드립니다. 이전에 이러한 규칙들을 볼 수 없었습니다. devTools와 fireBug에서 여러 번 쓰다듬어 가며, 한 시간 이상으로 그러한 간단한 "문제"를 해결했습니다.
.stretch 선택기로 정의 된 규칙은 #navigator li보다 구체적이지 않으며 나중에 계단식으로 정의하더라도 적용되지 않습니다. 그러므로 디스플레이는 언제나 될 것입니다 inline
무시되지 않습니다. 선택자가 더 구체적이기 때문에 #Navigation li에 의해 무시됩니다. display을 inline으로 설정합니다 (의도 한 inline block 대신).
Chrome에서 '요소를 조사 할 때이 기능을 쉽게 발견 할 수 있습니다. 그것은 요소의 스타일을 보여주고, 무시 된 스타일을 교차합니다.
답장을 보내 주셔서 감사합니다. 나는 지금 그것을 볼 수 있습니다. 왜 내가 전에 그것을 찾을 수 없었는지 알지 못합니다. 나는 그런 기본적인 문제를 해결하는 1 시간 후에 필사적이었다 :/ – Luckylooke
우리 모두는 때때로 그 문제를 가지고있다. :) – GolezTrol
#Navigation li은 id 선택자를 포함하고 있으므로 .stretch보다 높은 특이성이 있습니다.
비어있는 이유는 이전 요소 (, jsfiddle 코드)를 선택했을 가능성이 높기 때문입니다.
firebug에서 비어있는 li을 선택하면 무시됩니다.
답장을 보내 주셔서 감사합니다. 나는 지금 그것을 볼 수 있습니다. 왜 내가 전에 그것을 발견 할 수 없었는지 알지 못합니다. 나는 그런 기본적인 문제를 해결하는 1 시간 후에 필사적이었다 : – Luckylooke
그리고 왜 FireBug와 DevTools에서 over-lined가되지 않습니다. 너비 : 100 %; 심지어 li의 너비를 정의하는 더 구체적인 선택기를 설치하더라도 건너 뜁니다. – Luckylooke