왜 z- 인덱스를 사용하여 SVG 위에 div를 배치 할 수 없습니까?

Question

나는 following plunker을 가지고 있습니다. 볼 수 있듯이 (기본적으로 열려 있습니다) SVG 객체는 HTML 객체 위에 배치됩니다. 이것은 z-index가 -1 임에도 불구하고 (나는 또한 100을 시도했다).

// Navbar Component 
:host.opened{ 
    height: 136px; 
    z-index: 9999; 
} 
// SVG Component 
this.svg = d3.select(this.elementRef.nativeElement) 
    .append("svg") 
    .attr("width", 1200) 
    .attr("height", 400) 
    .style("z-index", -1) 

나는 하나

Answer 1

SVG는

가 DOM의 부모에 Z- 인덱스를 설정 Z- 인덱스를 사용하지 않는 SVG를 통해이 HTML 층 강요에 대해 가지고 수있는 방법을

[_nghost-qtc-0] jg-sankey { 
    position: absolute; 
    top: 50px; 
    left: 0px; 
    z-index: -10; 
}