HTML动态表 - 多值文本对齐问题

Question

我需要使用JavaScript构建动态HTML表格，其中单元格可能包含有关多个字段的数据，并且需要正确对齐事物。我在下面创建了样本表

在此示例中，第一行的最左边单元格包含3个国家/地区（项目）的名称，中间单元格包含有关国家/地区的信息，右侧单元格包含有关项目（国家/地区）的更多注释。我需要确保最左边单元格中的值应该根据中间和右侧单元格中的数据占用多少空间来对齐。如果“密钥”列移动到最后，则国家/地区的名称应显示与该国家/地区的“信息”对应。

同样在第二排，没有对Pizza的评论，所以对Burger的评论应该与关键的'汉堡'和关于汉堡的信息一致，而不是出现在顶部。

下图显示了错误的对齐方式，第1行的右侧单元格包含有关国家/地区的资本/人口数据未与该特定国家/地区对齐的人口。

任何有关如何处理此问题的建议都将受到高度赞赏。