html - 在表的右对齐和左对齐列中创建等间距的列

Question

我的表格有左右对齐的列，我需要在列内设置相等的间距。

有点像

justify-content: space-between 

但最好不要使用 flexbox 和网格，仅通过 html 表格。

.mtable {
  width: 100%;
  border: none;
  table-layout: fixed;
  font: normal 13px Arial, sans-serif;
}

.mtable th {
  padding: 10px;
  text-align: left;
  background-color: #ddd;
}

.mtable td {
  border-top: solid 1px #DADEE6;
  padding: 10px;
}

td:last-child {
  text-align: right;
}

td:nth-child(n+3) {
  text-align: right;
}

<table class="mtable">
  <tr>
    <td>Name</td>
    <td>Plaftorm</td>
    <td>Views</td>
    <td>Shows</td>
    <td>Fillrate</td>
    <td>Status</td>
  </tr>
  <tr>
    <td>Telegram</td>
    <td>Android</td>
    <td>60 011"</td>
    <td>40 631</td>
    <td>70 %</td>
    <td>On moderation</td>
  </tr>
  <tr>
    <td>WhatsApp</td>
    <td>iOS</td>
    <td>124 289"</td>
    <td>93 431</td>
    <td>43 %</td>
    <td>Active</td>
  </tr>
</table>

Answer 1

如果您知道您有多少列，您可以执行以下操作:

.mtable td {
  width: 10%
}

取决于您有多少列，将取决于 % 值。

所以对于一个 6 列的表，它将是:

.mtable td {
 width: 16.6666666667%;
}