html - Twitter Bootstrap：基于药丸的菜单的自动宽度

Question

我正在为网站使用 twitter 引导程序。现在我将药丸用作菜单（使用 java 脚本）但我希望它们自动填充菜单栏（使它们都具有相同的大小）。

我不认为它是内置于引导程序中的，所以有没有人建议如何做到这一点？

  <div class="row">
    <div class="span12 ban text-center">
      <ul class="nav nav-pills"  style="display: inline-block;">
        <li class="active"><a href="#home" data-toggle="pill"><i class="icon-home"> Home </a></li>
        <li><a href="#Info" data-toggle="pill"><i class="icon-home ">Info </a></li>
        <li><a href="#Fotos" data-toggle="pill"><i class="icon-camera"></i> Foto's</a></li>
        <li><a href="#Contact" data-toggle="pill"><i class="icon-home "> Contact </a></li>
      </ul>
    </div>
  </div>

一张图说清楚：1

Answer 1

在 Bootstrap 3 中有一个新的btn-group-justified类可能对你 有用

<div class="btn-group btn-group-justified">
<button type="button" class="btn btn-default">Left</button>
<button type="button" class="btn btn-default">Middle</button>
<button type="button" class="btn btn-default">Right</button>
</div>  

http://getbootstrap.com/components/#btn-groups-justified上的详细信息