CSS Flexbox：左边的中心容器
这个问题在这里已经有了答案：
使用margin-right: auto; 在你的最后一个项目（使用:last-child ）上添加一个边框，将你的方框推向左边：
.container {
padding: 1em;
display: flex;
overflow: auto;
flex-wrap: wrap;
min-width: calc(300px + 6em);
max-width: calc(400px + 8em);
align-items: center;
justify-content: center;
background: red;
}
.box {
width: 100px;
height: 100px;
background: #000;
margin: 1em;
display: block;
}
.box:last-child { margin-right: auto; }<h1> try resizing window</h1>
<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>我使用Chrome的“Inspect”功能将justify-content改为“flex-start”。
这似乎产生了你想要的结果。
