Question

我有一个使用bootstrap的移动导航，我希望在它下降时折叠现有内容（而不是推送内容）。

我已尝试在我能想到的所有内容上设置position: relative和z-index: 9999：

@media (max-width: 768px) {
.navbar-collapse {
    width: 200px;
    float: right;
    position: relative !important;
    z-index: 9999 !important;

}
.navbar {
    width: 200px;
    float: right;
    position: relative !important;
    z-index: 9999 !important;

}
.collapse {
    position: relative !important;
    z-index: 9999 !important;
}
}

到目前为止一切都没有效果，有人知道修复吗？

Answer 1

所以喜欢这个http://jsfiddle.net/7ocbs21d/1/

.navbar-static-top {
    position:absolute;
   width:100%;

}

Answer 2

您不应该为导航栏使用相对属性。如果你使用bootstraps固定导航栏，那么你将能够达到你想要的结果。

<nav class="navbar navbar-default navbar-fixed-top">

这是一个示例http://jsfiddle.net/7ocbs21d/

的小提琴

Bootstrap移动导航，希望＆＃34; drop over＆＃34;现有内容（z-index）

2 个答案: