Css Bootstrap 3.0-如何使两个按钮的宽度相同？

我有两个钮扣。一个文本很长，另一个文本很短

BS的默认设置是根据文本的长度改变按钮的长度。我的问题是：我怎样才能使它们都具有相同的长度，而不考虑文本长度

请参见我的示例：

---

谢谢大家!

我建议您测试以下代码。在这里，按钮组将扩展到父元素的宽度。如果工作，请删除内联样式

<div class="btn-group calendar-list-item" style="width:100%">
  <button type="button" class="btn btn-success" style="width:88%">I am a very long button for all the world to see</button>
  <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Action</a>
    </li>
    <li><a href="#">Another action</a>
    </li>
    <li><a href="#">Something else here</a>
    </li>
    <li class="divider"></li>
    <li><a href="#">Separated link</a>
    </li>
  </ul>
</div>

<br>
<br>
<div class="btn-group calendar-list-item " style="width:100%">
  <button type="button" class="btn btn-primary" style="width:88%">I wish I was that long</button>
  <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Action</a>
    </li>
    <li><a href="#">Another action</a>
    </li>
    <li><a href="#">Something else here</a>
    </li>
    <li class="divider"></li>
    <li><a href="#">Separated link</a>
    </li>
  </ul>
</div>

我是一个很长的按钮，全世界都可以看到
切换下拉列表















我希望我能那么久
切换下拉列表

---

您可以在按钮上使用“.btn block”类。这将把按钮扩展到父元素的宽度

如果您只是希望该按钮的长度相同，您可以将style=“width:310px；”添加到“我希望我是那个长按钮”或btn btn success{width:xxpx；}-希望它仍然适用于Bootstrap 3-然后只需将整个按钮包装在一个div中，并使用类似于

col-md-4

的类，它就可以工作了。