0

我有一个关于在 CSS 列中使用绝对定位的 div 的问题。基本上，我有一个菜单系统，它使用应用了计数 2 的无组织列表。在 li 元素之一悬停时，我希望出现一个绝对定位的 div - 它确实如此。但它似乎与第二列重叠，使其无法使用。在此处查看屏幕截图：http: //i.stack.imgur.com/PYuUE.png

<ul class="nav">
  <li>
    <a href="#">Internal Storage Solutions</a>
    <div class="drop">
      <ul>
        <li>
          <a href="#">Some Link</a>
        </li>
      </ul>
    </div>
  </li>
</ul>

您可以在开发人员工具中看到突出显示的淡蓝色元素是我需要看到的。我试过z-index，但它似乎在这里不起作用，所以我想知道这是否是一些奇怪的列行为？

提前致谢

4

1 回答 1

0

下拉菜单不显示的原因是它隐藏在包含的<li>. 我想出了一个解决方案，我将下拉列表<div>移到关联<li>并使用 JavaScript 显示/隐藏下拉列表之后。column-count似乎不适用于 StackOverflow 的代码片段，所以这里有一个 CodePen：http ://codepen.io/phantomesse/pen/OPvyGY

于 2015-02-17T20:31:56.210 回答