Twitter Bootstrap - 与其他元素排成一行的导航栏的宽度

Question

在移动版本中，我需要将徽标和导航栏放在一行中，但是导航栏内容太小（文本在两行上，一行会好得多）。 我可以做些什么来增加 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 ，以便所有内容都在一行中。 现在可以根据您的要求调整col-group 。 这是你修改过的小提琴

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