flex 最后一行 左对齐

 场景 ：

无法确定flex 换行后列表个数又不固定，直接调试html特别麻烦，使用Grid布局
Grid布局天然有gap间隙，且天然格子对齐排布，因此，实现最后一行左对齐可以认为是天生的效果。

<div class="box">
            <div class="list"></div>
            <div class="list"></div>
            <div class="list"></div>
            <div class="list"></div>
            <div class="list"></div>
            <div class="list"></div>
            <div class="list"></div>
        </div>

.box {
            width: 200px;
            display: grid;
            justify-content: space-between;
            grid-template-columns: repeat(auto-fill, 200px);
            grid-gap: 10px;
            .list {
                width: 100px; height:100px;
                background-color: skyblue;
                margin-top: 5px;
            }
        }

grid:

flex: