如何在div内绝对定位Bootstrap导航栏而不换行

Question

我正在尝试将导航栏覆盖到背景图像上。我这样做的方法是将其嵌套在 div 中，并使用绝对位置。但是，navbar-header/navbar-brand部分会导致导航栏的其余部分换行。

这是示例： https: //jsfiddle.net/qjxszebe/

我意识到还有一些关于创建背景图像的其他选项，但我想了解为什么这种简单的方法不起作用。

我想要的是修复上面的小提琴，以便导航栏如您所期望的那样位于一行上，而不是两行。

解决方案： 这是宽度为 100% 的工作小提琴：https ://jsfiddle.net/69yhavtj/

Answer 1

添加width:100%CSS 导航栏在同一行，而不是低栏。

您应该在班级中添加您的图像，class="img-responsive"因为您的图像不像他们那样响应

   .navbar {
      position: absolute;
      top: 0px;
      width: 100%;
    }