使用element-ui 的 el-row布局，设置gutter失效_el-row的gutter不生效

作者：Monodyee | 2024-02-20 04:01:37

踩

el-row的gutter不生效

问题描述：

在项目中使用el-row布局时，想设置一个间距，结果发现间距失效

<el-row :gutter="20">
        <el-col :span="12" style="border:1px solid #000">
        </el-col>
        <el-col :span="12" style="border:1px solid #000">
        </el-col>
</el-row>    
1
2
3
4
5
6

原因分析：

后面发现是因为 gutter 的实现方式是设置el-col的style，而我当时写demo的时候直接在el-col上设置的style，就导致gutter的间距样式不起作用。所以如果想设置样式的话就直接加个class，设置class的样式就好了

在这里插入图片描述

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Monodyee/article/detail/118302