Bootstrap 3 导航中的居中徽标

Question

我有一个 CodePen，我正在使用 Bootstrap 开发赌场网站的模拟移动版本。可见性等级正在发挥作用，使其仅在小屏幕或超小屏幕上出现。

导航栏中有一个徽标，我似乎无法居中 "correctly"。我需要徽标将栏的整个宽度纳入上下文，而不仅仅是整个宽度减去切换区域。

这是我的全页CodePen

这里是一个[=3=]”。它建议用对应于此CSS的DIV包装代码（但仍然没有用）：

.nav-center {
    margin:0;
    float:none;
}

.navbar-inner{
    text-align:center;
}

Answer 1

将width: 100vw或width: 100%添加到.navbar-header

Answer 2

好的，我明白了。花了一些时间，但我添加了这个...

.navbar-brand img {
  width: 197px;
  margin-left: auto;
  margin-right: auto;
  padding: 8px 0px;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
}

这一切都解决了。我也申请了我的 CodePen。

Bootstrap 3 导航中的居中徽标

Centering Logo in Bootstrap 3 Navigation

css

responsive-design

twitter-bootstrap