Question

我已经在我的网页中修复了导航栏。现在我有一个输入框，在对话框中打开一个建议列表。现在我面临的问题是对话框在导航栏下面，我希望它在导航栏。

对话框css

.search-overlay-container {
    position: static;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    width: 340px;
    box-shadow: 0 0 0px;
    padding: 0px;
    background-color: #343031;
    overflow: auto;
    margin-top: -79px;
    min-height: 475px;
    max-height: 475px;
}

固定导航栏

position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

Answer 1

添加高于导航栏的css z-index属性。 E.g：

z-index: 1000;

Answer 2

你将需要abs位置并给它最小的z-index：1031。为了不被隐藏，它需要比导航更高的z-index，将其视为叠在一起的纸张。父项需要相对于所有在该父项中具有z-index并且绝对定位的子项将根据z-index值进行堆叠，最高位于顶部。

此处提供更多信息： - https://en.wikipedia.org/wiki/Z-index

将模态div放在固定导航栏上

2 个答案: