Flexbox：我列表中的空格问题答案

【问题标题】：Flexbox: space-between issue in my listFlexbox：我列表中的空格问题
【发布时间】：2014-10-31 04:22:45
【问题描述】：

我有这个列表 ol 与项目 li 其样式如下：

ol {     
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    width: 400px;
}

li {
    width: 120px;
    height: 120px;
}

DEMO

如您所见，一排可以放 3 件商品。因为我使用的是justify-content: space-between，所以第一行看起来和我想要的完全一样。但是，第二行没有（因为它只有两个项目）。我希望它们被定位为好像有第 6 个元素（它们之间没有间隙并且左对齐）

我是否可以通过 flex box 实现这一点，或者我应该引入一个不可见的第 6 个元素？

【问题讨论】：

标签： html css flexbox

【解决方案1】：

使用display:flex; 和justify-content:space-between; 无法实现您的要求

我建议使用带边距的 justify-content:center; 或 justify-content:flex-start;。

【讨论】：