根据MetalFrog's answer to this problem，我正在尝试使单元格宽度适合其内容：
tr td.fit {
width: 1%;
white-space: nowrap;
}
正如here (jsfiddle) 所见，这非常有效。但是，通过将 twitter-bootstrap 按钮组添加到应该适合其内容宽度的单元格，按钮仍将在它们之间折回。 jsfiddle。
如何防止我的按钮被包裹起来？我还是想把它们排成一行。
编辑
我想保持表格宽度为 100%，因此删除单元格的 1% 宽度不是解决方案。只要标签标签之间有空间，从引导程序的.btn-group > .btn 中删除浮动也会在我的按钮之间留出空间，即使是不需要的但可以接受。
【问题讨论】：
标签： html css twitter-bootstrap twitter-bootstrap-3 css-tables
添加此 css decleration 将解决表格单元格包裹按钮组的任何问题。
.btn-group {
display: flex;
}
说明： 这定义了一个弹性容器；内联或块取决于给定的值。它为其所有直接子级启用了弹性上下文。默认情况下，弹性项目将全部尝试放在一行中。
【讨论】：
display:flex; 有帮助，因为目前还不清楚它为什么会解决问题。
.btn-toolbar 以防止在.btn-group 元素之间换行
修改后的答案：
inline-block 解决方案有点粗俗——恢复字体大小是不可靠的，因为你不能说“从两个级别上继承”，你必须明确设置它。
今天我将使用 flexbox，它可以消除项目之间的空白：
.btn-group {display: flex;}
...作为另一个用户的回答。详细说明：使用display: flex 使用 flex 相关属性的默认值 flex-direction（默认“行”表示水平流动），justify-content（默认“flex-start”表示项目被打包到开头行）和flex-wrap（默认“nowrap”）满足用例。
旧答案：
在按钮上使用 display: inline-block。这样做的副作用是标记中的任何空白都将呈现为按钮之间的可见空间，因此您必须使用 font-size 做这个小技巧：
.btn-group {
white-space: nowrap;
font-size: 0; // inline-block will show ALL whitespace between elements, so shrink it!
}
.btn-group .btn {
display: inline-block;
font-size: 14px; // restore font-size to whatever you are using for button text.
float: none;
clear: none;
}
请注意，这不适用于 IE7 及更早版本。其他方面支持还不错：http://caniuse.com/#search=inline-block
此外，为了响应不同的设备外形尺寸，您可能想提出一个替代组件，它的包装比 .btn-group 更优雅。
【讨论】：
我知道这可能是旧的，但这是我找到的解决方案。
我向btn-group-DIV 添加了btn-group-justified 类和设置宽度。
我只是将两个按钮的宽度设置为适合其内容所需的宽度。
<td class="fit" >
<div class="btn-group btn-group-justified" style="width:136px">
<a href="#" class="btn btn-second">Accept</a>
<a href="#" class="btn btn-highlight">Deny</a>
</div>
</td>
如果您的按钮是静态创建的，这将正常工作，但如果它们是动态生成的，您可以使用 javascript 将btn-group 的宽度设置为子项宽度的总和，或乘以最大按钮宽度乘子数量。
【讨论】：
如果您删除 float 属性，它们将水平对齐。
碰巧在表格单元格上设置 1% 的宽度不足以容纳浮动元素。如果您将其增加到 50%，它们将水平对齐。
请参阅此处测试 td 为 50%：http://jsfiddle.net/7zcHW/1/show
.btn-group > .btn, .btn-group-vertical > .btn {
float: left;
position: relative;
}
两种选择：
【讨论】：
true 你是false(false)。