弹性盒子flex 使用justify-content: space-between 时最下方子元素不左对齐

最新推荐文章于 2024-06-12 11:03:19 发布

知不可垀骤得

最新推荐文章于 2024-06-12 11:03:19 发布

阅读量245

点赞数

分类专栏： js vue 文章标签： css javascript 前端

本文链接：https://blog.csdn.net/qq_54580397/article/details/128900848

版权

js 同时被 2 个专栏收录

8 篇文章 1 订阅

订阅专栏

vue

4 篇文章 0 订阅

订阅专栏

            <el-checkbox-group
              v-model=""
            >
              <el-checkbox
                v-for="(item1, index) in item.optionname"
                :label="item1.VALUE"
                :key="index"
                >{{ item1.NAME }}</el-checkbox
              >
              <el-checkbox
                v-for="(item11, index1) in (6 - item.optionname.length % 6)"
                :label="item11"
                :key="index1 + '999'"
                class="dummy"
              ></el-checkbox>
            </el-checkbox-group>




样式
>>> .el-checkbox-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  .dummy {
    visibility: hidden;
  }
}

在最后一行空的地方铺满影藏元素即可

6 - item.optionname.length % 6 中的 6是每行的数量