IE8에서 Z- 색인 문제를 수정했습니다.

Question

"쉽게 이동 경로"와 같은 트레일을 만들 수있는 CSS를 만들고 있습니다. Here은 올바르게 렌더링되는 피 들러입니다. 분명히 IE8의 z-index 버그에 문제가 있지만이 blog에 나열된 수정 프로그램을 사용하면 문제가 해결되지 않습니다. 내 구조는 약간 다르지만 다른 모든 브라우저에서는 IE8 버그가 생성됩니다.

IE8에서 제대로 작동하고 다른 브라우저에서 작동하도록 올바른 방향으로 알려줄 수 있습니까? (< IE8은 상관하지 않습니다.)

나는 앵커와 부모 li 요소에 이미 z-index 속성을 추가했지만 별다른 차이가 없었습니다. 다른 브라우저에서는 부러졌습니다.

UPDATE 업데이트 fiddle anwser

Answer 1

음, 기본적으로 전에 하나를 겹칠 후 제공되는 항목 : 예를 들어, 목록에서 두 번째 항목이 될 최초의 "위에" 하나, 둘 다 절대적으로 위치한다면. 두 번째 문제는

, :after는 항상 자신을 위해 추가 작업을하고 그래서 그들의 자연적인 위치를 전환 할 수 :before 및 :after에 z-index 설정, 기본적으로 :before합니다 (z-index의 관점에서) "위에"배치됩니다.

따라서 breadcrumb 항목의 오른쪽에 삼각형을 두지 않고 IE8에서 z-index 문제를 해결할 수 있어야한다고 생각합니다. 왼쪽에서 두 번째 항목의 삼각형은 첫 번째 항목에 대한 화살표를 만듭니다 항목, 두 번째는 세 번째 항목 등입니다. (당신이 원하는 경우)

그냥 마지막 항목 on this updated jsFiddle의 ul에 :before과 :after을 추가하고 갈 수 있어야합니다. IE8에서 jsFiddle이 제대로로드되지 않습니다. 다른 누구도 확인할 수 있습니까?