切换汉堡包按钮时，Bootstrap Navbar 折叠向左和向右移动答案

【问题标题】：Bootstrap Navbar collapse moves to left and right when toggling hamburger button切换汉堡包按钮时，Bootstrap Navbar 折叠向左和向右移动
【发布时间】：2016-04-25 21:15:33
【问题描述】：

我在.navbar-collapse.collapse.in 类中删除了padding-left，因此导航看起来更中心。但是，当我切换汉堡按钮时，导航栏折叠的行为很奇怪。

当我在较小的视口中尝试使用引导程序navbar-collapse 时，这个错误不存在。我知道这可能是因为我手动启用 navbar-collapse 以使用以下代码处理 IPAD 肖像：

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 

    .navbar-collapse.collapse {
        display: none !important;
        padding-left:0;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
        padding-left:0;
    }
    .navbar-header .collapse, .navbar-toggle {
        display:block !important;
    }
    .navbar-header {
        float:none;
    }
    .navbar-nav>li {
        float:none !important;
    }
}

我在这里创建了一个类似的 sn-p 代码，可以看到类似的错误：
http://codepen.io/ngp130895/pen/ZWMQqo
我该如何解决这个问题？

【问题讨论】：

标签： html css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

因为切换时填充变为 0。如果你在菜单显示时添加padding: 15px，那么它就不会产生这种错误。

这是分叉版本 - http://codepen.io/kalpeshsingh/pen/jqvWRa

【讨论】：

您好，感谢您的回答。但是，我想要填充 0。
为什么要填充零？有什么情况吗？
因为我将导航项居中。 15px 的填充会让它们看起来不在中心

【解决方案2】：

我自己找到了答案。我也从 navbar-collapse 类中删除了 padding-left。

.navbar-collapse {
   padding-left:0;
}

不过，Bootstrap 有点奇怪。

【讨论】：