弹性盒子 justify-content: space-between；换行问题

本文介绍: 弹性盒子 jus t ify-content: s p ace–b e tween; 换行问题

用弹性盒子布局的时候想一行排列n 个元素让他们具有相等的距离而且换行但是只要元素多了一换行就会出现下面这个问题以一行排列四个元素为例

第二行换行之后串位了

    &lt;script&gt;
        (num =&gt; {
            let container = document.querySelector('.container')
            let boxs = container.querySelectorAll('.box')
            let y = boxs.length % num
            let addBoxNum = num - y
            for (let index = 0; index < addBoxNum; index++) {
                let container = document.querySelector('.container')
                let cloneBox = boxs[0].cloneNode(true)
                cloneBox.style.visibility = 'hidden'
                container.appendChild(cloneBox)
            }
        })(4)//每行排列元素的数量
    </script&gt;