css 如何使列的大小响应于元素的数量?

5uzkadbs  于 2023-03-14  发布在  其他
关注(0)|答案(1)|浏览(93)

我需要使响应网格布局的最后一行可能有更少的元素在奇数元素的情况下,但无论如何它需要在全宽拉伸。元素将在管理中添加,所以我们有一些条件下的元素和空间的数量在css/js。我该怎么做?
我试过自动调整,但我不知道如何将其拆分为相等的行
下面是我想要的示例:

vom3gejh

vom3gejh1#

使用flex代替grid

.container {
   display: flex;
   gap: 5px;
   flex-wrap:wrap;
}

.container > * {
  flex: 1 15%;
  background: red;
  height: 25px;
}
<div class="container">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

相关问题