html - 两个电池组对齐左

Question

我实际上尝试了所有方法，但找不到 CSS 解决方案。

我有一个简单的行表，有两列。该表的固定宽度为 400 像素。我左列右对齐，右列左对齐。所以它看起来像这样:

       Table header
===============================
     Firstname: John
      Lastname: Smith
           Age: 49
===============================

由于表格比数据宽，显示的数据看起来不太好。

我想要实现的是相同的结果，但现在两个单元格左对齐(前面没有填充)

       Table header
===============================
Firstname: John
 Lastname: Smith
      Age: 49
===============================

我可以通过定义单元格的宽度来做到这一点，但是事先不知道数据。

所以我需要删除 td:first-child 填充空间，但是不知道怎么办。

任何提示将不胜感激

Answer 1

我会使用 width: 1px; white-space: nowrap; 在 td:first-child 中删除填充

查看我的 FIDDLE