Html 带两个全宽块按钮的引导列

我想要一个引导列，当屏幕类型改变时，可以很好地调整按钮的大小。但是按钮之间没有空格，两条独立的线（在小屏幕上）

我如何让它们调整大小为更小的按钮，而不是拆分到新行

例子！

您可以使用

col-xs-3

而不是

col-md-3

和

col-xs-offset-4

而不是

col-md-offset-4

请记住，引导网格行有12列，因此，您正在使用的偏移量或列的总和应为12，并以小屏幕设备为目标，如移动设备

col xs-*

。其他一切都很好

<div class="form-group">
    <div class="col-xs-3 col-xs-offset-6">
        <a href="#" class="btn btn-success btn-block" role="button">Add Item</a>
    </div>
    <div class="col-xs-3">
        <a href="#" class="btn btn-danger btn-block" role="button">Remove Item</a>
    </div>
</div>

---

如果您希望小型设备和大型设备具有相同的样式，可以省略

md

样式，只需使用

sm

。如果width get非常小，您可以删除

偏移量

，并在元素上使用获得的宽度，而不是

xs

宽度

要修复被切断的按钮，请移除

btn块

class

---

如果我没有问题，请尝试我的更新代码

您询问了如何使按钮的大小变小，而不是拆分到新行上，这似乎就解决了问题。你说的切断是什么意思？请检查我的答案。好的，试试看。我已经解决了被切割的按钮。@Matthewmolone，如果这解决了您的问题，请将其标记为“已接受”。

<div class="form-group">
    <div class="col-xs-3 col-xs-offset-6">
        <a href="#" class="btn btn-success btn-block" role="button">Add Item</a>
    </div>
    <div class="col-xs-3">
        <a href="#" class="btn btn-danger btn-block" role="button">Remove Item</a>
    </div>
</div>