html - CSS z-index 不工作(绝对位置)

标签 html css css-position absolute

<分区>

我正在尝试使黑色 div(相对)高于第二个黄色(绝对)。黑色 div 的父级也有一个绝对位置。

#relative {
	position: relative;
	width: 40px;
	height: 100px;
	background: #000;
	z-index: 1;
	margin-top: 30px;
}
.absolute {
	position: absolute;
	top: 0; left: 0;
	width: 200px;
	height: 50px;
	background: yellow;
	z-index: 0;
}
<div class="absolute">
    <div id="relative"></div>
</div>
<div class="absolute" style="top: 54px"></div>

预期结果:

enter image description here

最佳答案

移除

z-index:0;

来自 .absolute

Updated fiddle here.

关于html - CSS z-index 不工作(绝对位置),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20971340/

相关文章:

css - 固定标题 DIV 在没有设置边距的情况下向下推

jquery - 固定 float 元素停在页脚

html导航栏不显示内联

javascript - 如何让一页上的多个 slider 功能彼此分开?

html - div 之间的空白

html - 我有 <a> 链接正在工作,但由于某种原因已停止

html - 如何在此网格中的所有框之间添加相等的空间?

javascript - 单击时更新 DIV 内容,无需直接知道其 ID

ios - 带有 Cordova 垂直滚动的 Framework7 在 iOS 上不起作用

html - 使用 CSS 将 div 与图像重叠