Question

我在z-index定位div上遇到absolute属性问题。

这是我的代码：

<nav>
    <li>
      <a href="#">Nav1</a>
      <div class="sub_nav">
        <ul>
          <li><a href="#">SubNav1</a></li>
          <li><a href="#">SubNav2</a></li>
        </ul>
      </div>
    </li>
 </nav>


<div id="tabs">
   <ul>
      <li><a href="#tabs-1">Tab1</a></li>
      <li><a href="#tabs-2">Tab2</a></li>
   </ul>
   <div id="tabs-1">
       sjdhfjdshfjsdhf sdjfhsdjfhsdf jsdhfjsdhfj
   </div>
   <div id="tabs-2">
       jsahdjashdjahsd ajshdjahsdjas jashdjashdjhasjhdja
   </div>
</div>

nav li位于relative，sub_nav位于absolute。列表位于屏幕右侧的左侧和选项卡中。当我将nav li悬停在sub_nav div后面时{/ 1}}。

这是我的Css：

tabs

.sub_nav{ position: absolute; left: 100%; top: 0; background: #eee; width: 200px; z-index: 99999 } div中没有z-index。

任何帮助都将受到高度赞赏。

Answer 1

显然position:relative div中有一个tabs。我删除了，问题解决了：）

Answer 2

给z-index：99;到<ul>

Answer 3

这不是Z指数问题你在'。left:100%'中输入了错误的值“sub_nav”，将其替换为“right:0px;"或您的结构需要

这是小提琴链接visit this

Z-index不能在绝对定位的div中工作

3 个答案: