javascript - Twitter Bootstrap - 与其他元素排在一起的导航栏宽度

Question

在移动版中，我需要将 Logo 和导航栏排成一行，但是导航栏内容太小(文本在两行中，一行会好得多)。我可以做些什么来增加 100% 的宽度吗？

我在这里创建 jsfiddle http://jsfiddle.net/8ayj7o36/

  <div class="row">
    <div class="col-xs-8 col-sm-8 col-md-3">
        <a href="#" class="logo"><img src="../img/logo.png" alt="" class="" /></a>
    </div>
    <div class="col-xs-4 col-sm-4 col-md-9">

  <!-- Static navbar -->
  <div class="navbar navbar-default">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Project name</a>
    </div>
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li><a href="#">Link dfa dfa dfdf</a></li>
        <li><a href="#">Link bbbb bbb bb</a></li>  
      </ul>
    </div><!--/.nav-collapse -->
  </div>
 </div>
  </div>   

感谢您的帮助!

Answer 1

把 <a>在 navbar-header 中与您的 Logo 相对应的标签，所以一切都落在单行中。现在轮到你调整col-group根据您的要求。这是你修改过的Fiddle

<div class="navbar-header">
<a href="#" class="logo"><img src="../img/logo.png" alt="logo" class="" /></a>
-
-
-
</div>