如何将表格中的数字向左对齐?

Question

https://jsfiddle.net/6a7d2snj/

我想将所有数字对齐到表格列内的左侧：

50
5
-40
-4

但是怎么做呢？style="align:right"会在右边给我正确的对齐方式，但我希望在左边这个！

Answer 1

如果没有具有特定宽度的其他换行元素，文本对齐是不可能的。

没有 CSS 方法来对齐不共享父元素的元素/文本。

table, th, td {
border: 1px solid black;
}
span {
display: inline-block;
width: 4ch;
text-align: right;
background: pink;
}

<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td><span>5</span></td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td><span>50</span></td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td><span>-50</span></td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td><span>-4</span></td>
</tr>
</table>