css - 如何在 Bootstrap 3 中使表单按钮大小相等？

Question

如何在不对每个按钮进行硬编码固定宽度的情况下使可见按钮的宽度相等？是否有适用于任何尺寸按钮的通用解决方案(因为这取决于文本)

这是截图:

<div class="btn-toolbar">
<button class="btn-success btn btn-default" name="resolution" value="corrected" type="submit">Submit</button>
<div class="pull-right btn-group">
<button class="btn-warning btn btn-default" name="resolution" value="skipped" type="submit">Skip</button>
<button class="btn-warning btn btn-default" name="resolution" value="not_found" type="submit">Not found</button>
</div>
</div>

Answer 1

将所有按钮都设置为固定宽度并不是一件好事，因为按钮的宽度将取决于按钮的文本。它看起来不太好。但如果这对你来说是必须的，那么你可以为你的按钮添加一个类，并在你的 css 规则中为该类分配一个固定的宽度。或者你也可以直接在你的 css 上为你的 button 设置一个固定的宽度。但我强烈建议不要这样做，因为它看起来不太好。为这两种情况添加代码

通过添加类

<button class="btn-warning btn btn-default fixed_width" name="resolution" value="skipped" type="submit">Skip</button>

在你的 CSS 文件上

.fixed_width{
    width:**YOUR_DESIRED_WIDTH_GOES_HERE**;
}

或者直接赋值——

button{
    width:**YOUR_DESIRED_WIDTH_GOES_HERE**;
}