解决flex布局space-between最后一行左对齐的方法

最近在做页面的时候遇到了一个情况，具体是这样的。

给最外面的大盒子设置justify-content:space-between;这个样式的时候，如果盒子的个数是1个，
3的倍数，或者是3的倍数+1的时候，是正常的。但是当盒子的个不符合刚才所列举的个数。就会
出现最后一行中间是空的。如下图:

1670408593847.png

我试了试网上大家说的最多的一种方法

.main:after {
    content: "";
    flex: auto;
  }

虽然是靠左了没错，但是跟他前一个div挨着，且每个模块都是这样

再继续找~~~
这是原创作者的链接，分享给大家:
jb51.net)](https://www.jb51.net/css/736179.html

只需两行代码即可实现

.main div:after {   // main是我最外层大盒子的名称
     content: "";
     width: 6.62rem;  // 这个宽度为里面div的宽度
 }

以上就是解决flex布局space-between最后一行左对齐的方法了
如果这篇文章对你有帮助，或者在进行中遇到其他问题，欢迎评论区留言出来。
我们一起探讨~