display: flex布局的时候最后两个div没有靠左对齐，如何解决？

Question

如下图所示，设置了display:flex;justify-content: space-arround;flex-wrap: wrap;但是多余的两个div没有靠左显示

Answer 1

解决了：
父节点.game-wrap:

.game-wrap{
    display: flex;
    flex-flow: row wrap;
}

子节点：.game-box{}

.game-box{
   flex: 0 1 250px;
}

Answer 2

你设置了justify-content: space-around;这是根据宽度平均分配间隔
想向左对齐就用justify-content: flex-start;,但这样你就要手动设置间隔了
这种布局我一般都是用justify-content: flex-start;，然后第一层的子元素每个25%宽度，再设置一个padding,这样每个的间隔就一样了

Answer 3

justify-content: flex-start;

Answer 4

你不是设置了 justify-content: space-arround; 吗，想要靠左，应该 justify-content: flex-start;

Answer 5

可以多生成两个空节点呀，保持四倍

Answer 6

这种布局其实也可以用grid布局

Answer 7

.list-item {

  width: 22%;
  margin-right: 4%;
  &:nth-child(4n) {
    margin-right: 0;
  }
}

父级设置

flex: 1;
display: flex;
flex-wrap: wrap;
align-content: flex-start;