Html Can'；布局=固定时，不更改列宽和边距

我尝试在特定的列上设置列宽，但不起作用。我的表格是

layout=fixed

和

width=100%

。我为其中一列设置了

max width=300px

，但没有任何变化，所有列都均匀分布在一个表中。我的表对固定列宽没有响应

CSS:

    table {
        table-layout: fixed;
        border-collapse: collapse;
        width: 100%;
    }

<div class="container-fluid">
   <table class="table table-hover ml-3 mr-3">
      <tr class="headers bg-primary text-white headers">
         <th>
             @Html.DisplayNameFor(model => model.Name)
         </th>
         <th>
             @Html.DisplayNameFor(model => model.Account)
         </th>
         <th>
             @Html.DisplayNameFor(model => model.Day)
         </th>
      </tr>

   <tbody id="myTable" class="align-middle">

      <tr>
         <td style="word-wrap: break-word; white-space:normal">
             @Html.DisplayFor(modelItem => item.Name)
         </td>
         <td style="max-width: 300px">  <!-- here I set column width  -->
             @Html.DisplayFor(modelItem => item.Account)
         </td>
         <td>
             @Html.DisplayFor(modelItem => item.Day)
         </td>
      </tr>

    </tbody>
   </table>
</div>

HTML:

    table {
        table-layout: fixed;
        border-collapse: collapse;
        width: 100%;
    }

<div class="container-fluid">
   <table class="table table-hover ml-3 mr-3">
      <tr class="headers bg-primary text-white headers">
         <th>
             @Html.DisplayNameFor(model => model.Name)
         </th>
         <th>
             @Html.DisplayNameFor(model => model.Account)
         </th>
         <th>
             @Html.DisplayNameFor(model => model.Day)
         </th>
      </tr>

   <tbody id="myTable" class="align-middle">

      <tr>
         <td style="word-wrap: break-word; white-space:normal">
             @Html.DisplayFor(modelItem => item.Name)
         </td>
         <td style="max-width: 300px">  <!-- here I set column width  -->
             @Html.DisplayFor(modelItem => item.Account)
         </td>
         <td>
             @Html.DisplayFor(modelItem => item.Day)
         </td>
      </tr>

    </tbody>
   </table>
</div>

@DisplayNameFor（model=>model.Name）
@DisplayNameFor（model=>model.Account）
@DisplayNameFor（model=>model.Day）
@DisplayFor（modelItem=>item.Name）
@DisplayFor（modelItem=>item.Account）
@DisplayFor（modelItem=>item.Day）

将

style=“max width:300px”

添加到

也没有帮助。 而且

ml-3

和

mr-3

的效果也不好，我只在左边加了边距。此外，水平滚动条显示在表格底部

这就是它的样子：

---

属性

max width

仅适用于块元素，因此您需要应用它

显示：块

：

<td style="max-width: 300px; display: block; margin: auto;">
 XYZ
</td>

名称
账户
白天
XYZ
XYZ
XYZ

不幸的是，没有任何变化，但我用这条规则测试了您的代码，我得到了它。指定单元格的最大宽度未超过300像素。是的，我在第一个解决方案中出错，完全忘记了

max width

仅适用于

block

元素。我已经更新了答案。检查。好的，它工作了，谢谢！总是很乐意帮忙！