All the examples in Element docs show components nicely spaced one from each other.
When taking a basic example such as
new Vue({
el: "#app"
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<link href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" rel="stylesheet" />
<div id="app">
<el-row :gutter="20">
<el-col :span="4">
<el-input></el-input>
</el-col>
<el-col :span="4">
<el-input></el-input>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="4">
<el-input></el-input>
</el-col>
<el-col :span="4">
<el-input></el-input>
</el-col>
</el-row>
</div>you see that the two rows of <el-input> are glued one to each other.
:gutter is a solution to space columns horizontally. What is the correct approach to space the rows vertically? (see for instance this example where the two rows are spaced)
