简单的方案:

  <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>的宽度是一样的。


当前回答

我也遇到过这个问题,我用这个方法来克服…所以你可以试试

<td style=“min-width:120px;”>B</td>

其他回答

这个组合解决方案为我工作,我想要等宽的列

<style type="text/css">

    table {
        table-layout: fixed;
        word-wrap: break-word;
    }

        table th, table td {
            overflow: hidden;
        }

</style>

结果:-

引导4.0

在Bootstrap 4.0中,我们必须通过添加类d-flex来声明表行为flex-box,并删除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>
    </tbody>
</table>

希望这将有助于其他人在那里!

干杯!

在我的例子中,我是这样解决的

<style>
td {
    min-width: 175px;
}
</style>

因此每个表格单元格的最小宽度为175px。您可以更改该值以使其适合您的目的。

你可以在这里找到更多关于min-width的信息:https://developer.mozilla.org/en-US/docs/Web/CSS/min-width?retiredLocale=de

使用固定的表布局CSS在表,并设置一个百分比的td。

如果没有页面html或其他CSS的上下文,就很难判断。你的CSS规则不影响td元素可能有无数个原因。

您是否尝试过更具体的CSS选择器,例如

tr.somethingontrlevel td.something {
  width: 90px;
}

这可以避免您的CSS被来自引导CSS的更具体的规则所覆盖。

(顺便说一下,在你的内联CSS样本样式属性,你拼错了宽度-这可以解释为什么尝试失败!)