Html flexbox项目-使用拉伸对齐忽略页边距底部

在一组具有“拉伸”对齐的flexbox项目中，当一个项目具有页边距底部时，其他项目将扩展以包括该页边距。有没有一种方法可以创建一个灵活的布局，即使将边距底部应用于其中一个元素，项目也保持相同的高度

演示：

.flex{
显示器：flex；
宽度：100%；
}
.flex div{
填充：50px；
背景色：红色；
利润率：10px；
柔性生长：1；
}
.flex div：第一个孩子{
边缘底部：50px；
}

是否将填充应用于父级？或者将对齐方式更改为flex Start如果您打算将其添加到所有元素中，您为什么只将其应用于一个元素？@Pete这是一种特殊的布局，我需要将一行已包装的flex项目保持在其原始高度，但在单个项目上使用边距来在行之间创建空间您可能正在寻找“flexbox砌体”只需谷歌一下。@Pete所以在一个响应性包装的flex布局中，这可能意味着使用javascript来确定哪些项目要应用边距（一行中的所有项目），这是我试图避免的