Html 在两个垂直div之间的右侧添加空格

我想将div排列在彼此下方，但较低的div应移到右侧。所以我期待这样的输出

现在，我已经通过使用下面的代码使其工作

<div id="div1" class="checkbox">
                        <label>
                            <input type="checkbox" id="chk1" data-bind="checked: data1" />
                            <span>DIV 1</span>
                        </label>
</div>
<div id="div2" class="checkbox" style="text-align: center;width: 370px">
                        <label>
                            <input type="checkbox" id="chk2" data-bind="checked: data2" />
                  <span>div2</span>
                        </label>
</div>

所以基本上我减小了div2的宽度，并将文本对齐到中心，但我认为这不是一个好方法。还有更好的方法吗？

.集装箱{ 显示器：flex； 弯曲方向：立柱； 宽度：200px } 第一组{ 高度：20px； 宽度：150px； 边框：1px实心； } 第二组{ 高度：20px； 宽度：150px； 边框：1px实心； 自对准：柔性端； } 第一组 第二组

---

如果只有两个div需要隔开；您可以在HTML标记中使用以下内容之一

-添加单个空格 &ensp；-添加2个空格 &emsp；-添加4个空格 第一组 &emsp； 第2组

---

我不知道你的要求，但如果你想在较小的屏幕上删除输入之间的空格，那么最好只在第二个div中添加一个空格，因为没有简单的方法可以删除css中的空格；因此，如果您确实需要所有屏幕尺寸上的空间，那么这应该不会有任何负面影响。