CSS_flex布局解决最后一行分散问题 飞鸟和蝉

<div class="container">
  <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 class="list"></div>
  <div class="list"></div>
  <div class="list"></div>
  <div class="list"></div>
</div>

.container {
  float: left;
  border: 1px solid #000;
  display: flex;
   290px;
  flex-wrap: wrap;
  justify-content: space-between;
  resize: both;
}
.list {
   65px;
  height: 65px;
  margin-bottom: 10px;
  background-color: rgb(148, 148, 131);
  margin-right: 10px;
}
.list:nth-child(4n) {
  margin-right: 0px;
}
.container::after {
  content: '';
  display: block;
  flex: 1 1 auto; // 会主动放大, 会主动缩小, 自适应宽度
}