1. 问题描述
在使用element-ui时,采用布局中的el-row
与el-col
,想要将el-col之间
设置间隔,在el-row
中添加属性:gutter,发现并没有间隔出现
2. 问题代码
<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>
3. 解决方法
后面发现是因为在el-col中设置了style样式,才导致gutter的间距样式不起作用。 所以如果想设置样式的话就直接加个class形式
<el-row :gutter="20">
<el-col :span="12" class="col_style">第一部分
</el-col>
<el-col :span="12" class="col_style">第二部分
</el-col>
</el-row>
<style>
.col_style {
style="border:1px solid #000"
}
</style>