无法在另一个元素

问题描述:

编辑以链接的问题之间的区别讲解的顶部得到HTML元素:无法在另一个元素

我的问题是不同的,因为:1。 我想覆盖的要素是无关 2.这是SVG元素

有人可以建议这些情况下的工作解决方案吗?


我基本上想把所有的文本元素放在路径元素的顶部。看起来我遵循标准规则(用z-index设置的元素),但它不起作用。这是为什么?

text { 
 
    position: fixed; 
 
    z-index: 2 
 
} 
 
path { 
 
    position: relative; 
 
    z-index: 1 
 
}
<svg width="1191" height="751"><g id="holdDonut" transform="translate(595.5,375.5)"> 
 
    <g class="arc"> 
 
    <path d="M2.238042025441788e-14,-365.5A365.5,365.5,0,0,1,13.18655527399621,-365.2620494384899L6.593277636998105,-182.63102471924495A182.75,182.75,0,0,0,1.119021012720894e-14,-182.75Z" style="fill: rgb(152, 171, 197);"></path> 
 
    <text transform="translate(4.9457632502712405,-274.0803806383672)" dy=".35em">28</text></g> 
 
    <g class="arc"> 
 
    <path d="M13.18655527399621,-365.2620494384899A365.5,365.5,0,1,1,-6.714126076325364e-14,-365.5L-3.357063038162682e-14,-182.75A182.75,182.75,0,1,0,6.593277636998105,-182.63102471924495Z" style="fill: rgb(138, 137, 166);"> 
 
    </path> 
 
    <text transform="translate(-4.9457632502711455,274.0803806383672)" dy=".35em">3 086</text> 
 
    </g> 
 
    </g> 
 

https://codepen.io/anon/pen/jLGGpz

+0

(HTTPS [在CSS不起作用的z-index]的可能的复制:// *.com/questions/9377029/z-index-in-css-doesnt-work) – achref

+0

这不是SVG路径和元素的定位方式。这就是'viewbox'协调系统的作用。 –

尝试移动上述的path元件text元件