如何绝对定位div中的Bootstrap导航栏而不包装

Question

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

以下是示例： https://jsfiddle.net/qjxszebe/

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

我想要的是上面的小提琴，以便导航栏在你想要的单行上，而不是两行。

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

Answer 1

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

您应该在class="img-responsive"课程中添加您的图片，因为您的图片不像他们完成的那样具有反应性

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