Datatable.net - 文本对齐：左不起作用

Question

我有以下表格设置（后台有 datatables.net），我想知道为什么我不能左对齐表格标题。

<table class="display" id="latest_tbl" style="width:100%">
    <thead>
        <tr>
            <th style="width:15%; text-align:left">
                Date
            </th>
            <th style="width:15%; text-align:left">
                User
            </th>
            <th style="width:15%; text-align:center">
                Status
            </th>
            <th style="width:15%; text-align:center">
                Date1
            </th>
            <th style="width:15%; text-align:left">
                User2
            </th>
            <th style="width:15%; text-align:center">
                Date2
            </th>
            <th style="width:10%"></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="width:15%; text-align:left">
                d1
            </td>
            <td style="width:15%; text-align:left">
                u1
            </td>
            <td style="width:15%; text-align:center">
                stat1
            </td>
            <td style="width:15%; text-align:center">
                d1
            </td>
            <td style="width:15%; text-align:left">
                u2
            </td>
            <td style="width:15%; text-align:center">
                d2
            </td>                
            <td style="width:10%">
               <input type="submit" value="Approve" class="btn btn-info" disabled />
            </td>
        </tr>
    </tbody>
</table>

我刚查了一下，“问题”也出现了，没有datatables.net。

感谢您的帮助！

PS：澄清一下：我希望有与我的代码示例中相同的设置，但在我的情况下，它看起来像这样：

我想让标题和内容按顺序对齐。

Answer 1

当我理解正确时，您希望将所有标题左对齐，但在您的代码中使用 text-align: center 我希望您使用内联样式来展示目的:)

<table class="display" id="latest_tbl" style="width:100%">
    <thead>
        <tr>
            <th style="width:15%; text-align:left">
                Date
            </th>
            <th style="width:15%; text-align:left">
                User
            </th>
            <th style="width:15%; text-align:left">
                Status
            </th>
            <th style="width:15%; text-align:left">
                Date1
            </th>
            <th style="width:15%; text-align:left">
                User2
            </th>
            <th style="width:15%; text-align:left">
                Date2
            </th>
            <th style="width:10%"></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="width:15%; text-align:left">
                d1
            </td>
            <td style="width:15%; text-align:left">
                u1
            </td>
            <td style="width:15%; text-align:left">
                stat1
            </td>
            <td style="width:15%; text-align:left">
                d1
            </td>
            <td style="width:15%; text-align:left">
                u2
            </td>
            <td style="width:15%; text-align:left">
                d2
            </td>                
            <td style="width:10%">
               <input type="submit" value="Approve" class="btn btn-info" disabled />
            </td>
        </tr>
    </tbody>
</table>