flex布局这种5个元素的情况怎么处理？

Question

如果是5个元素的情况下不让最后一个元素靠最右边 和第四个并列对齐 这个应该怎么办？或者grid布局也行

<view class="list">
        <view class="item" wx:for="{{[2,2,2,2,2]}}">
          <image src="http://aigou-file.obs.cn-south-1.myhuaweicloud.com/images/125/2021/06/b1D91d6sAR9v1gUGtu91TrmT77g11V.png"></image>
          <text>微博</text>
        </view>
</view>

.list{
  display: flex;
  margin-top: 30rpx;
  width: 100%;
  min-height: 250rpx;
  flex-wrap: wrap;
  justify-content: space-between;
}
.item{
  display: flex;
  flex-direction: column;
  width: 222rpx;
  height: 250rpx;
  justify-content: center;
  align-items: center;
  margin-bottom: 20rpx;
  font-size: 33rpx;
}

Answer 1

/* 最后一项margin-right:auto */
.list:last-child {
    margin-right: auto;
}

你说不行，我再提供一种方法

/* 使用伪元素辅助左对齐 */
.list:after {
    content: '';
    flex: auto;    /* 或者flex: 1 */
}

Answer 2

推荐看看这篇文章:
https://www.zhangxinxu.com/wo...