如何在数据表中将 <td> 的内容居中答案

【问题标题】：How to center the content of a <td> in a Datatable如何在数据表中将 <td> 的内容居中
【发布时间】：2021-11-12 05:21:13
【问题描述】：

我有一个数据表，在 <td> 内有一个 css 方块，我想居中，但我不知道该怎么做。

未对齐正方形的图像：

到目前为止我已经尝试过：

th.dt-center, td.dt-center { text-align: center; }

columnDefs: [ { className: 'text-center', targets: '_all' }, ]

根据我在this SO question看到的内容

我也试过了：

<th style="text-align:center;"></th>
<td style="text-align:center;"></td>

它适用于<th>，但不适用于<td>

我也尝试了解决方案provided here

"columnDefs": [
    {"className": "dt-center", "targets": "_all"}
]

到目前为止，我还没有设法以任何方式使广场居中

【问题讨论】：

这能回答你的问题吗？ Center text in table cell
方形元素 (.square) 的行为类似于块，因此使用像 text-center 这样的内联或文本样式规则不会产生您期望的行为。要使块级元素居中，请在块元素本身上声明margin: auto，即.square { margin: auto; }
@blurfus 不，它没有
请edit 您的问题并添加minimal reproducible example 以便更快地进行故障排除。没有什么特别的原因说明上面的答案不适合你，所以它一定是你的代码非常具体的东西，因为我们看不到它，我们只能猜测答案

【解决方案1】：

margin: 0 auto; 应该适用于 .square 类。

【讨论】：

【解决方案2】：

根据我对您的问题的理解，只需使用

td {
     text-align:center;
}

如果你想让正方形也居中，

th,td {
     text-align:center;
}

还在这里分享了更改链接live link，

【讨论】：

【解决方案3】：

尝试在表格中使用 flexbox

td{
    display: flex;
    align-items: center;
    justify-content: center;
}

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。