Javascript 如何使用CSS和html在容器内动态创建和排列复选框？

我想创建一个容器，将复选框排列成表列。 目前在下面的html代码中，它显示了以下输出

以下是我的代码：

添加应用程序
{{name}}

我的ts是：

applicationList=[
"申请6",，
"申请7",，
"申请8",，
"申请9",，
"申请10",，
"申请11",，
“申请12”，
];

在这里，我根据arraylist中的srno编号对边距值进行了硬编码。 我希望这是动态计算的。

---

请帮助我，提前谢谢。

您可以删除

硬代码

，并使用flex解决此问题

css:

.box{
高度：300px；
显示器：flex；
弯曲方向：立柱；
柔性包装：包装；
}
.box>*{
flex:180px；
}

一个
两个
三
四
五
六
七
八
九

这更像是一个css问题，请在a中的复选框中显示呈现的html和css，我已经添加了css，但没有为2和3列添加边距。正如您在上面的代码中所看到的，我为第2列和第3列级别的数据添加了边距。您可以在

框

类上添加一个常规填充（即：20px）并获得边距。