如何解决前端的flex流动布局中的单个子元素位置

2025-04-14 06:53:41

推荐回答（2个）

回答1：

flex item的margin不与相邻flex item的折叠，margin为auto值时伸缩包含块剩余的空间将会分配到flex item的外边距margin上，这个可用于实现居中效果:
.wrap{
display: flex;
}
.item{
margin: auto;
}
同时，后面也说了，这将会使其旁边的flex item尽可能的往它的那边靠。
因此，要实现题主所说的布局，只要给第二个p元素一个margin-right:auto就行了

回答2：

其实可以用下一级别的flex实现,前两个p可以完成合并为一个div，这样就很让容易实现需求的。