如何将 link 置于另一个具有 position:absolute 的 div 之上

Question

我有以下 HTML 和 CSS，其中 #header id 的位置必须强制设置为 absolute:

<div class="main">
    <a href="www.website.com">
    <div id="header" class="other">
</div>


#header{
    padding-left: 250px; 
    position:absolute;
}

此代码将 header div 设置在 link 标签上，它变得（link）无法选择。

我的问题是 CSS 我必须向 .main > a 申请什么才能使其不低于 header div？

我尝试了以下方法，但它不起作用，所以欢迎任何其他想法：

.main > a {
    z-index:99999;  
}

Answer 1

如果您不将 position 设置为 relative、absolute 或 fixed，z-index 属性将不会生效。

.main > a {
    position: relative;
    z-index:99999;  
}

Answer 2

z-index will work only on positioned elements

如果没有为元素指定定位，则不会应用

z-index。因此，我建议您稍微更改一下 CSS，如下所示。

即 .main > a 的新 CSS 就像

.main > a {
    position:relative;
    z-index:99999;  
}

更新

z-index 不适用于静态定位的元素。请参阅答案 here

如何将 link 置于另一个具有 position:absolute 的 div 之上

How to position a link over another div that has position:absolute

html

css

position

css-position

absolute