CSS flex wrap：在项目之间放置间隙，除非包裹？

我经常遇到这种情况，即我有2个flex子级，具有属性flex方向行。因此，它们首先并排显示，中间有一个间隙（右边空白）

通过调整大小，只要没有足够的空间容纳这两个对象，flex wrap就会将第二个子对象移动到第一个子对象下，因此我不需要从1开始向右移动边距。再也没有了

是否可以根据“换行”状态动态设置页边距

小提琴：

小提琴注意：你应该调整窗口的大小（减少宽度）并看到包装好的盒子。如果继续减小宽度，您将看到第一个子项的文本也将拆分为两行，因为右边的边距在那里并且占用空间

.parent{
显示器：flex；
弯曲方向：行；
柔性包装：包装
}
.儿童1{
右边距：300px
}

儿童1文本
儿童2文本

您可以尝试使用CSS网格：

.parent{
显示：网格；
栅柱间隙：300px；
网格模板列：重复（自动拟合，最小值（100px，最大内容））；
}
.parent>*{
边框：1px实心；
}

儿童1文本
儿童2文本

我知道这是一个老问题，但您可以使用“列间距”和“行间距”来定义某些方向的间距

例如：

.class{
  display: flex;
  align-items: center;
  column-gap: 10px;
  flex-wrap: wrap-reverse;
  flex-direction: row;
}

---

在这种情况下，间隙将只影响列。

请显示您的代码这在CSS和Flex中是不可能的。如果我们知道你的最终结果，建议解决办法会更容易。好吧，最常见的解决办法是给孩子们的四周留一个空白（

margin:150px

，而不是

margin right:300px

），然后在父母身上留一个负的空白（

margin:-150px

）只留下孩子们之间的空隙。@akcasoy检查一下，例如：@akcasoy这可能也有关系：