引导导航栏折叠摆动效果答案

【问题标题】：bootstrap navigation bar on collapse swinging effect引导导航栏折叠摆动效果
【发布时间】：2016-05-13 18:26:56
【问题描述】：

我的导航栏在折叠时出现问题，因为当我单击我的汉堡按钮时，我的列表显示时会出现奇怪的摆动效果。

这是css代码：

.navbar-header{float:none}
a.navbar-brand{float:none}
img.brand{display:block;margin-left:auto;margin-right:auto;text-align:center;width:47%}
.collapse.navbar-collapse{float: none;text-align: center;padding-left:4%;padding-right: 4%}
.collapse.navbar-collapse ul{float: none;display: inline-block}

如果有人想看看，这里是链接：

http://chickapea.larchedigitalmedia.com/

提前谢谢你

【问题讨论】：

标签： twitter-bootstrap mobile navigation hamburger-menu

【解决方案1】：

您在本机引导类中拥有所有自定义样式。这将导致东西破裂。我认为您的“摇摆”是因为您的text-align: center; 课程在您的.collapse 课程上。当您单击汉堡包按钮时，.collapse 类会消失，因此您的 .collapse 类的所有属性也会消失。

在元素上创建自定义类，并将 CSS 应用于自定义类而不是引导类。

【讨论】：