Twitter bootstrap 为什么Twitter引导表总是有100%的宽度？

假设此标记：

<table class="table table-bordered" align="center"> 

---

不管我有多少个单元格，表格总是100%宽。为什么

引导程序中的所有表都会根据其容器进行拉伸，您可以通过将表放置在所选的

.span*

网格元素中来轻松地进行拉伸。如果要删除此属性，可以创建自己的表类，并将其添加到要扩展的表中，其中包含以下内容：

.table-nonfluid {
   width: auto !important;
}

您可以在自己的样式表中添加此类，只需将其添加到表的容器中，如下所示：

<table class="table table-nonfluid"> ... </table>

。。。

---

这样，您的更改不会影响引导样式表本身（您可能希望在文档的其他地方有一个流动的表格）。

我也遇到了同样的问题，我修复了表格，然后指定了我的td宽度。如果你有th，你也可以这样做

<style>
table {
table-layout: fixed;
word-wrap: break-word;
}
</style>

<td width="10%" /td>

桌子{
表布局：固定；
单词包装：打断单词；
}

---

我对.table nonfluid没有任何运气。

我尝试添加

style=“width:auto！important”

，效果非常好

引导程序3：
为什么要反抗？为什么不使用引导网格简单地控制表的宽度呢

<div class="row">
    <div class="col-sm-6">
        <table></table>
    </div>
</div>

以下是文档：
如果您使用的是Bootstrap 4，请使用
.w-auto

请参见
，因为它有效地使用了其父宽度；这就是网格系统应该如何工作！您希望表格的宽度是多少？我希望它取决于单元格的数量，就像普通表格一样，对于那些正在研究如何通过span检查设置单元格宽度如div width的人来说，如果您将表格放在span*标记内，为了使表格居中，您是否也会包括偏移*。@dlackey Yes，你可以用一个类来偏移表格以居中，你甚至可以在表格中添加一个
.span*
类来增加宽度。至少在bootstrap 3中，它只在添加
后对我有效！重要信息
到
宽度：auto
我们必须对表使用bootstarp的span类，或者我们必须手动为.span类指定样式，警告。如果与.table responsive和.table bordered组合使用，请小心。当低于屏幕宽度767px时，边框应用于.table响应容器。（bootstrap3.x）尝试
width:auto！重要的你可以避免
！重要信息
（这是一个）。请参阅注释。如果您确保自定义CSS显示在引导CSS之后（例如，您的自定义样式
标记显示在引导
标记下方），则规则将按设计层叠，您不需要使用
！重要信息
所有异常。这是正确的，因为
宽度：100%是为中的
表定义的，因此它将取代
宽度：自动规则。不是真正的答案，最好编辑大多数人阅读的当前公认答案（我现在编辑了它）。这是迄今为止最简单的解决方案，应该是公认的答案
<table class="w-50"></table>