如何在内容换行时使弹性框宽度与内容相同

Question

我需要使用与内容（项目）相同的类网格来创建div的宽度。

但是当项目换行到下一行时，我需要相应地缩小div，所以我不会在项目的左侧和右侧有任何额外的空间。

提前致谢！

＆＃13;

＆＃13;

.home {
  height: 100vh;
  display: flex;
  align-items: center;
}
.grid {

    flex-basis: content;
  display: flex;
  background-color: red;
  flex-wrap: wrap;

}
.gridItem {
  margin: 2px;
  width: 90px;
  height: 60px;  
  background: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
};

＆＃13;

<div class='home'>
  <div class='grid'>
    <div class='gridItem'>Item 1</div>
    <div class='gridItem'>Item 1</div>
    <div class='gridItem'>Item 1</div>
    <div class='gridItem'>Item 1</div>
    <div class='gridItem'>Item 1</div>
    <div class='gridItem'>Item 1</div>
    <div class='gridItem'>Item 1</div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;