justify-content: space-between; 布局问题

Question

.container{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 30rpx 28rpx;
  justify-content: space-between;
}

如果数量不刚好是3的倍数的话，justify-content: space-between; 布局会这样

Answer 1

7七月 2022-03-14 00:24:09

这个没什么太好的办法，有个办法是强行获取最后一个元素，然后单独修改他的位置

Answer 2

oldfu 2022-06-30 18:34:04

换成grid布局

Answer 3

提问者 YAYO老祖 2022-03-14 09:24:05

.container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 30rpx 28rpx;
}
.container:after {
  content: "";
  width: 33%;
}