简单的方案:
<tr class="something">
<td>A</td>
<td>B</td>
<td>C</td>
<td>D</td>
</tr>
我需要为<td>设置一个固定宽度。我试过了:
tr.something {
td {
width: 90px;
}
}
Also
td.something {
width: 90px;
}
for
<td class="something">B</td>
甚至
<td style="width: 90px;">B</td>
但是<td>的宽度是一样的。
当前回答
这个组合解决方案为我工作，我想要等宽的列
<style type="text/css">
table {
table-layout: fixed;
word-wrap: break-word;
}
table th, table td {
overflow: hidden;
}
</style>
结果:-
其他回答
在引导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>
在我的案例中，我能够通过使用min-width: 100px而不是width: 100px来修复单元格th或td的问题。
.table td, .table th {
min-width: 100px;
}
如果没有页面html或其他CSS的上下文，就很难判断。你的CSS规则不影响td元素可能有无数个原因。
您是否尝试过更具体的CSS选择器，例如
tr.somethingontrlevel td.something {
width: 90px;
}
这可以避免您的CSS被来自引导CSS的更具体的规则所覆盖。
(顺便说一下，在你的内联CSS样本样式属性，你拼错了宽度-这可以解释为什么尝试失败!)
您可以创建一个colgroup并将这些类应用到col标记，而不是将col-md-*类应用到行中的每个td。
<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>
演示
我已经为这个问题纠结了一段时间了，所以以防万一有人和我犯同样愚蠢的错误…… 在<td>中，我应用了带有white-space:pre style的元素。这使得我所有的table/tr/td技巧都被丢弃了。当我删除该样式时，突然间我所有的文本都在td中被很好地格式化了。
所以，总是检查主容器(如table或td)，但也总是检查你是否在更深的地方取消你的beautifull代码:)
