简单的方案:

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


当前回答

如果在表上使用<table class="table">, Bootstrap的表类将为表添加100%的宽度。您需要将宽度更改为自动。

此外,如果表的第一行是标题行,则可能需要将宽度添加到th而不是td。

其他回答

如果在表上使用<table class="table">, Bootstrap的表类将为表添加100%的宽度。您需要将宽度更改为自动。

此外,如果表的第一行是标题行,则可能需要将宽度添加到th而不是td。

试试这个——

<style>
 table { table-layout: fixed; }
 table th, table td { overflow: hidden; }
</style>

好的,我刚刚找出了问题所在-在引导设置为默认值宽度选择元素,因此,解决方案是:

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

其他的都对我没用。

在Bootstrap 4中使用d-flex代替row表示“tr”

问题是“row”类比父容器占用更大的宽度,这就产生了问题。

<table class=“table”> <tbody> <tr class=“d-flex”> <td class=“col-sm-8”>你好</td> <td class=“col-sm-4”>World</td> </tr> <tr class=“d-flex”> <td class=“col-sm-8”>8 列</td> <td class=“col-sm-4”>4 列</td> </tr> </tbody> </table>

引导程序4和5有一个宽度实用程序,用于调整html元素的宽度 例子:

<tr class="w-50">
    <td class="w-25">A</td>
    ...
</tr>