儿童家长VS Z-指数问题

我看了几个相关的问题，但我cannt找到一个解决方案。我甚至试图在本文中使用该解决方案，但它对我没有任何作用。 >https://philipwalton.com/articles/what-no-one-told-you-about-z-index/儿童家长VS Z-指数问题

我需要的“悬停”要在“底部”分区。请注意，我无法更改元素的声明位置。

有没有解决方案？

我的代码：

.top { 
 
    position: fixed; 
 
    z-index: 1; 
 
} 
 

 
.hover { 
 
    position: absolute; 
 
    z-index: 999; 
 
} 
 

 
.bottom { 
 
    position: absolute; 
 
    z-index: 1; 
 
}

<div class="top">top 
 
    <div class="hover">HOVER</div> 
 
</div> 
 
<div class="bottom">bottom<div>

来源

2017-07-06 DMR

总之，你不能：'.top'曾经分配'位置的**新的堆叠内容**创建：fixed'，所以它的任何孩子都不会成为其兄弟姐妹的顶部，无论您使用的z-index有多高。了解更多关于堆叠内容：https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context – Terry

我不知道你的最终目标是什么......这是你想要的去做？ https://codepen.io/anon/pen/gRdYYy –

嗨@MichaelCoker ..我需要“自下而上”结束了“顶” ..但“盘旋”在“底部” ......自从“哈弗”是其子必须成为所有元素.. – DMR

你不能。子元素只能在父母区域内改变。如果您尝试更改childs css并且它适合父级，则父级css将覆盖它。

你可以尝试使用JS移动孩子的父母DIV之外。我会建议在jquery中使用.append（）。

来源

2017-07-06 21:07:59

儿童家长VS Z-指数问题

回答

相关问题