Bootstrap 3 - 如何在组中的一个按钮中实现全宽度

Question

<div class="input-group">
  <button class="btn btn-default full-width">
    <span class="pull-left"><i class="fa fa-sitemap"></i> Fills remaining width</span>
  </button>
  <div class="input-group-btn">
    <input type="submit" class="btn btn-default" value="submit">
    <button class="btn btn-default">
      <i class="fa fa-pencil"></i>
    </button>
    <button class="btn btn-default">
      <i class="fa fa-trash-o"></i>
    </button>
  </div>
</div>

我已经使用上面的html来创建顶部按钮组。我想调整它以实现一个更像下面的按钮组，在最宽按钮的右侧没有圆角。

Answer 1

.full-width {
  width: 100%;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.full-width span i {
  margin-right: 10px;
}

如果有其他人感兴趣，将这些样式添加到我的 .full-width 类就可以了。我有兴趣看看是否有人知道Bootstrap 3只能实现相同的外观。