在表格内对齐答案

【问题标题】：Aligning within Table在表格内对齐
【发布时间】：2020-06-08 23:25:53
【问题描述】：

好的，所以我的问题如下 - 我正在一个表格中工作，其中有一个日期和时间列，我希望时间全部保持对齐 - 当有 100 个实例时，它开始看起来真的很混乱就像下面的例子一样，因为每次都从不同的地方开始。我玩过 flex 但它使日期和时间在宽显示器上彼此远离，有什么想法吗？

2020 年 2 月 17 日凌晨 3:24
2019 年 12 月 4 日 3:10 am
2019 年 12 月 3 日下午 12:22

只是一个非常简单的代码示例来演示这一点 ->

<html>
  <body>
    <table width='200px'>
      <tbody>
        <tr>
        <td >Feb, 17, 2020 3:24 am</td> <br/>
        </tr>
        <tr>
        <td>Dec, 4, 2019 3:10 am</td> <br/>
        </tr>
        <tr>
        <td>Dec, 3, 2019 12:22 pm</td>
        </tr>

    </table>
  </body>

</html>

【问题讨论】：

如果您能分享截图或工作代码，将有助于我们准确理解并提供解决方案。
当然@xaid 刚刚更新了帖子！谢谢

标签： html css html-table alignment text-alignment

【解决方案1】：

table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 300px;
}

td,
th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

.time_position {
  margin-right: 5px;
  float: left;
}

<table>
  <tbody>
    <tr>
      <td> Feb, 17, 2020 <span class="time_position">3:24 am |<span></td>
        </tr>
        <tr>
        <td>Dec, 4, 2019 <span class="time_position">3:10 am |</span></td>
    </tr>
    <tr>
      <td>Dec, 3, 2019 <span class="time_position">2:22 pm |</span></td>
    </tr>

</table>

我希望这会有所帮助...

【讨论】：

不知道为什么我没有想到先显示时间。我正是这样做的，如果小时数小于 10，则在小时前添加一个 0，现在看起来很完美。