用动画调整框的大小

Question

我创建了一个html / css代码，该代码列出了适合屏幕宽度的div数量。 我希望当屏幕的宽度发生变化并且div对齐时div能够平滑移动。

当我尝试搜索时，我不知道确切的关键字。

我想创建一个类似于以下网站的动画。 https://www.kia.ca/all-vehicles

它是代码。

.box{
  position: relative;
  border: 5px solid red;
  text-align: center;
}

.item{
  display: inline-block;
  border: 3px solid blue;
  width: 285px;
  height: 215px;
}

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