解决flex布局处理最后一行分布不是左对齐的问题

Jul-9

于 2023-11-20 11:41:40 发布

阅读量230

点赞数 1

文章标签： css 前端 css3

本文链接：https://blog.csdn.net/LiangBlog/article/details/134504250

版权

我的答案是不用flex，flex布局处理这个有多种方法，但是都不方便且不符合动态分配原理。
我们可以采用grid来解决这个问题，改动也不多。
代码就几句，如下：

  display: grid;
  justify-content: space-between;
  // 根据子元素的盒子的份额自动计算可以平铺几次 285px为每个item的宽度 这里看你自己定义的宽度是多少
  grid-template-columns: repeat(auto-fill,285px);
   // grid-gap 是 row-gap 和 column-gap 的简写形式。
  grid-gap: 0;