jquery数据表中每列的最大宽度答案

【问题标题】：Max width for each column in jquery datatablejquery数据表中每列的最大宽度
【发布时间】：2020-06-17 12:53:52
【问题描述】：

表格

<div class="row">
   <div class="col-lg-6">
       <table id="datatable" class="table table-bordered dt-responsive nowrap" style="border-collapse: 
       collapse; border-spacing: 0; width: 100%;">
          <thead>
            <tr>
               <th>Sr. No.</th>
               <th>Product</th>
               <th>Status Description</th>
            </tr>
         </thead>
         <tbody>
            <tr>
               <td>1</td>
               <td>Product 1</td>
               <td>Description</td>
            </tr>
            ....
         </tbody>
     </table>
   </div>
</div>

我想减小Product列的宽度，它应该是固定大小的，如果其中的数据长度增加也不应该增加。

我曾尝试在 th 中使用 width="20%" 但它只会影响默认宽度。我也试过：

$('#datatable').dataTable( {
  "columnDefs": [
    { "width": "20%", "targets": 0 }
  ]
} );

但它也会改变默认宽度，但如果在 td 中插入更长的数据，它会增加。

此外，状态描述中的数据显示在一行中，有时会超出页面，我如何才能保持该状态不变，以便数据显示在多行中。

我的目标是减少产品列的宽度，以便状态描述列可以与产品显示在同一行。

【问题讨论】：

我在<th> 中使用内联css，就像style="width: 10px;" 一样为我工作
@Vpa 对表格没有影响。

标签： html jquery css datatable

【解决方案1】：

对我有用，我认为您的数据表是原因......因为您正在使用扩展行（也许）

【讨论】：

【解决方案2】：

只需从类中删除 nowrap 以便数据显示在多行中，如果要删除 +/- 删除 dt-responsive 并添加 table-layout:fixed在表格的样式标签中，并指定每列的宽度。

【讨论】：