当多行挠曲项目包装时，移除它们之间的空间(间隙)
我正试图在一个设置高度的容器中，在彼此下面放置一些物品。如果没有空间，则项目将在彼此之间继续进行。
这就是我的想法：
我正试着用柔性箱来实现这一点，一个有固定高度的容器，方向被设置为column和flex-wrap是wrap:
问题是两栏之间有很大的差距。
我试着设置两个justify-content和align-items到flex-start，但这可能是默认值。
有什么办法解决这个问题吗？
以下是代码：
* {
box-sizing: border-box;
}
body {
font-family: sans-serif;
}
.container {
display: flex;
flex-wrap: wrap;
height: 300px;
flex-direction: column;
background-color: #ccc;
}
.items {
width: 100px;
height: 100px;
margin: 10px;
background-color: tomato;
color: white;
font-size: 60px;
font-weight: bold;
text-align: center;
padding: 15px;
}
<div class="container">
<div class="items">1</div>
<div class="items">2</div>
<div class="items">3</div>
<div class="items">4</div>
<div class="items">5</div>
</div>
小唯快跑啊