最后一行对齐是flexbox的一个常见问题。
一种可以考虑的方法是在最后一个可见项之后使用不可见的Flex项。简而言之，我称它们为“跟踪幻影项”。

.outside {
  border: 1px solid black;
}
.container {
  margin: -5px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.container:after {
  content: '';
  flex: auto;
}
.box {
  background: red;
  width: 50px;
  height: 50px;
  margin: 5px;
}

.hidden {
  visibility: hidden;
  margin: 0 5px;
  height: 0;
}

<div class="outside">
  <div class="container">
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
    <div class="box hidden"></div>
  </div>
</div>

Michael是对的，问题是你不能先做space-between，然后再选择最后一行为flex-start。但对我来说突出的部分是指定的宽度。这很重要吗
如果没有，通常的方法是使用媒体查询来控制每行显示多少项。您可以设置大量的媒体查询步骤，以确保项目不拉伸太多，但这样的空间之间更紧密地排队与您的正常网格排水沟，它使“最后一行问题”消失。你觉得这有用吗？
示例：http://codepen.io/anon/pen/JbpPKa

Stack Overflow不允许我对Michael_B的回答发表评论，但我确实想说明如何使用JavaScript来计算要追加的幻影元素的数量，以供任何试图解决这个问题的人使用。

/**
  * @param {Integer} numElements The number of elements you're displaying.
  * @param {Number} element Width Width, in pixels, of each element.
  * @param {Number} margin Width, in pixels. Your minimum target margin between items. 2x the margin on each individual item.
  * @param {Number} containerWidth Width, in pixels, of the containing element.
*/
  const getNumPhantomElements = ({numElements, elementWidth, margin, containerWidth}) => {
  const elementsPerRow = Math.floor(containerWidth / (elementWidth + margin));
  const elementsInLastRow = numElements % elementsPerRow;
  const numPhantomElements = elementsPerRow - elementsInLastRow;

  return numPhantomElements;
};

在这种情况下：

const containerWidth = document.querySelector('.container').offsetWidth;
  const numPhantomElements = getNumPhantomElements({
   numElements: 21,
   elementWidth: 50,
   margin: 10, // 2x 5px margin on each box
   containerWidth
}); // Append this many elements (output depends on your viewport size)