Div滑到另一个下面

Question

如果可以的话，我正试图通过CSS在另一个div元素.menu下滑动一个绝对定位的div元素（#slideout）。

这是我的：code

点击红色标签即可看到; #slideout涵盖.menu，这不是我追求的。我想把它放在.menu下面，只留下突出的红色标签，这样用户就可以再次点击以显示该元素。

我尝试过的事情： 我给.menu一个高z指数。 我给#slideout一个较低的z-index甚至没有z-index。

但这不起作用。

如果整个事情也有回应，那就太好了。你能给我一些CSS技巧甚至jQuery吗？

Answer 1

Z-index 默认情况下通过元素的顺序继承它的位置，并通过定位（例如，具有绝对定位的元素很可能与没有任何位置的元素重叠，但是最多从浏览器到浏览器的不同之处，要覆盖它，你必须设置一个定位{ relative，absolute，fixed }，然后添加所需的z-index。

---

在您的情况下，您必须将position:relative;添加到.menu才能使其正常工作，否则正如我之前提到的那样，它将继承元素顺序的继承或它们具有的定位。 的 CSS：

.menu {
  background: none repeat scroll 0 0 #E0E0E0;
  height: 100px;
  width: 100%;
  position:relative;
  z-index: 99999 !important;
}

这将解决所有问题