English 简单方案：
<tr class="something">
<td>A</td>
<td>B</td>
<td>C</td>
<td>D</td>
</tr>
我需要为设置一个固定宽度<td>。我试过了：
tr.something {
td {
width: 90px;
}
}
也
td.something {
width: 90px;
}
对于
<td class="something">B</td>
乃至
<td style="width: 90px;">B</td>
但是的宽度<td>仍然相同。
<div class="row" id="divcashgap" style="display:none">
<div class="col-md-12">
<div class="table-responsive">
<table class="table table-default" id="gvcashgapp">
<thead>
<tr>
<th class="1">BranchCode</th>
<th class="2"><a>TC</a></th>
<th class="3">VourNo</th>
<th class="4" style="min-width:120px;">VourDate</th>
<th class="5" style="min-width:120px;">RCPT Date</th>
<th class="6">RCPT No</th>
<th class="7"><a>PIS No</a></th>
<th class="8" style="min-width:160px;">RCPT Ammount</th>
<th class="9">Agging</th>
<th class="10" style="min-width:160px;">DesPosition Days</th>
<th class="11" style="min-width:150px;">Bank Credit Date</th>
<th class="12">Comments</th>
<th class="13" style="min-width:150px;">BAC Comment</th>
<th class="14">BAC Ramark</th>
<th class="15" style="min-width:150px;">RAC Comment</th>
<th class="16">RAC Ramark</th>
<th class="17" style="min-width:120px;">Update Status</th>
</tr>
</thead>
<tbody id="tbdCashGapp"></tbody>
</table>
</div>
</div>
</div>这是我不必处理IE时经常做的事情
<tr>
<th scope="col" style="width: calc(1 * 100% / 12)">#</th>
<th scope="col" style="width: calc(4 * 100% / 12)">Website</th>
<th scope="col" style="width: calc(3 * 100% / 12)">Username</th>
<th scope="col" style="width: calc(3 * 100% / 12)">Password</th>
<th scope="col" style="width: calc(1 * 100% / 12)">Action</th>
</tr>
这样，您就可以拥有一个熟悉的12列网格。
这些对我都不起作用，并且在数据表上有很多cols可以使％或sm类等于bootstrap上的12个元素。
我正在使用数据表Angular 5和Bootstrap 4，并且表中有许多列。对我来说，解决方案是TH添加DIV具有特定宽度的元素。例如，对于cols“人名”和“活动日期”，我需要指定一个宽度，然后div在col标头中放置一个，然后将整个col宽度调整为从div上的div指定的宽度TH：
<table datatable [dtOptions]="dtOptions" *ngIf="listData" class="table table-hover table-sm table-bordered text-center display" width="100%">
<thead class="thead-dark">
<tr>
<th scope="col">ID </th>
<th scope="col">Value</th>
<th scope="col"><div style="width: 600px;">Person Name</div></th>
<th scope="col"><div style="width: 800px;">Event date</div></th> ...
在bootstarp 4中，您可以使用row，col-*在表中，我将其使用如下
<table class="table">
<thead>
<tr class="row">
<th class="col-sm-3">3 row</th>
<th class="col-sm-4">4 row</th>
<th class="col-sm-5">5 row</th>
</tr>
</thead>
<tbody>
<tr class="row">
<td class="col-sm-3">some text</td>
<td class="col-sm-4">some text</td>
<td class="col-sm-5">some text</td>
</tr>
</tbody>
</table>
在Bootstrap 4中使用d-flex代替“ tr”的行
问题是，“行”类比父容器占用更多的宽度，这会带来问题。
<table class="table">
<tbody>
<tr class="d-flex">
<td class="col-sm-8">Hello</td>
<td class="col-sm-4">World</td>
</tr>
<tr class="d-flex">
<td class="col-sm-8">8 columns</td>
<td class="col-sm-4">4 columns</td>
</tr>
</tbody>
</table>我已经为这个问题苦苦挣扎了一段时间，以防万一有人犯了和我一样的愚蠢错误……在内部，<td>我white-space:pre应用了具有样式的元素。那使我所有的表/ tr / td技巧都被丢弃了。当我删除该样式后，突然我的所有文本都被很好地格式化了td。
因此，请始终检查主容器（如table或td），而且还要始终检查是否不取消更深处的代码：)
没有页面html或CSS其余部分的上下文很难判断。CSS规则不影响td元素的原因可能不胜枚举。
您是否尝试过更具体的CSS选择器，例如
tr.somethingontrlevel td.something {
width: 90px;
}
这样可以避免引导CSS中更具体的规则覆盖CSS。
（顺便说一句，在具有style属性的内联css示例中，宽度拼写错误-这可以解释为什么尝试失败的原因！）
好的，我刚发现问题出在哪里-在Bootstrap中将它设置width为selectelement 的默认值，因此解决方案是：
tr. something {
td {
select {
width: 90px;
}
}
}
还有什么对我没有帮助。
这个组合的解决方案对我有用，我想要等宽的列
<style type="text/css">
table {
table-layout: fixed;
word-wrap: break-word;
}
table th, table td {
overflow: hidden;
}
</style>
结果：-
在Bootstrap 4.0上，我们必须通过添加类d-flex将表行声明为flex-boxes，并删除xs，md，后缀以允许Bootstrap从视口自动派生它。
因此它将看起来如下：
<table class="table">
<thead>
<tr class="d-flex">
<th class="col-2"> Student No. </th>
<th class="col-7"> Description </th>
<th class="col-3"> Amount </th>
</tr>
</thead>
<tbody>
<tr class="d-flex">
<td class="col-2">test</td>
<td class="col-7">Name here</td>
<td class="col-3">Amount Here </td>
</tr>
</table>
希望这对外面的人有帮助！
干杯!
对于Bootstrap 4，您可以简单地使用类帮助器：
<table class="table">
<thead>
<tr>
<td class="w-25">Col 1</td>
<td class="w-25">Col 2</td>
<td class="w-25">Col 3</td>
<td class="w-25">Col 4</td>
</tr>
</thead>
<tbody>
<tr>
...
尝试这个 -
<style>
table { table-layout: fixed; }
table th, table td { overflow: hidden; }
</style>
就我而言，我能够通过使用min-width: 100px而不是width: 100px单元格th或来解决此问题td。
.table td, .table th {
min-width: 100px;
}
如果<table class="table">在表上使用，Bootstrap的表类将为表添加100％的宽度。您需要将宽度更改为自动。
另外，如果表的第一行是标题行，则可能需要将宽度添加到th而不是td。
希望这可以帮助某人：
<table class="table">
<thead>
<tr>
<th style="width: 30%">Col 1</th>
<th style="width: 20%">Col 2</th>
<th style="width: 10%">Col 3</th>
<th style="width: 30%">Col 4</th>
<th style="width: 10%">Col 5</th>
</tr>
</thead>
<tbody>
<tr>
<td>Val 1</td>
<td>Val 2</td>
<td>Val 3</td>
<td>Val 4</td>
<td>Val 5</td>
</tr>
</tbody>
</table>
我遇到了同样的问题，我将表固定了，然后指定了td宽度。如果您有，也可以做。
table {
table-layout: fixed;
word-wrap: break-word;
}
模板：
<td style="width:10%">content</td>
请使用CSS构造任何布局。
无需将col-md-*类应用于td行中的每个类，您可以创建一个colgroup并将类应用于col标签。
<table class="table table-striped">
<colgroup>
<col class="col-md-4">
<col class="col-md-7">
</colgroup>
<tbody>
<tr>
<td>Title</td>
<td>Long Value</td>
</tr>
</tbody>
</table>
在这里演示
在Bootstrap 4.0.0中，您不能col-*可靠地使用这些类（在Firefox中有效，但在Chrome中不可用）。您需要使用OhadR的答案：
<tr>
<th style="width: 16.66%">Col 1</th>
<th style="width: 25%">Col 2</th>
<th style="width: 50%">Col 4</th>
<th style="width: 8.33%">Col 5</th>
</tr>
在twitter bootstrap 3中使用：class="col-md-*"其中*是宽度的列数。
<tr class="something">
<td class="col-md-2">A</td>
<td class="col-md-3">B</td>
<td class="col-md-6">C</td>
<td class="col-md-1">D</td>
</tr>
在twitter bootstrap 2中使用：class="span*"其中*是宽度的列数。
<tr class="something">
<td class="span2">A</td>
<td class="span3">B</td>
<td class="span6">C</td>
<td class="span1">D</td>
</tr>
**如果您有<th>元素，请在此处而不是在元素上设置宽度<td>。
使用.something没有TD或第