按百分比调整表格列宽答案

【问题标题】：Adjust table column width by percentage按百分比调整表格列宽
【发布时间】：2021-01-11 06:59:37
【问题描述】：

我想根据百分比设置每列的宽度。我写了以下CSS，但它不适用于列表我的代码：

<table class="footable table Grid table table-striped table-bordered smart-form dataTable default breakpoint footable-loaded">
    <thead>
        <tr>
             <th class="tenpercent footable-first-column" style="direction:rtl; text-align:right;" data-hide="">select<div><input id="SelectAllRows" class="selectallrows" type="checkbox"></div> </th>
             
             ...
        </tr>
    </thead>
    <tbody>
            <tr>
                <td class="tenpercent footable-first-column"><span class="footable-toggle"></span> 
                    <input class="select" id="36174" name="36174" type="checkbox" value="true"><input name="36174" type="hidden" value="false">
                </td>
                ...
             </tr> 
    </tbody>

</table>


<style>
th.tenpercent, td.tenpercent {
    min-width: 5%;
    max-width: 5%;
    width: 5%;
}
</style>

为什么？

【问题讨论】：

标签： html css datatable

【解决方案1】：

您可以使用 td 中的 style 属性来设置列的宽度。

<tbody>
            <tr>
                <td class="tenpercent footable-first-column" style='width: 5%'><span class="footable-toggle"></span> 
                    <input class="select" id="36174" name="36174" type="checkbox" value="true"><input name="36174" type="hidden" value="false">
                </td>
                ...
             </tr> 
    </tbody>

【讨论】：