element踩坑小記一（el-row寬度溢出）

• 在使用珊格系統時，如果使用了有分隔的佈局也就是將gutter設置爲非零時，會使頁面寬度溢出出現滾動條破壞了佈局美觀性

<el-row :gutter="20">
    <el-col :span="12"><div class="grid-content bg-purple"></div></el-col>
    <el-col :span="12"><div class="grid-content bg-purple"></div></el-col>
</el-row>

• 原因是因爲父容器沒有設置足夠的padding，所以會造成el-row寬度變長從而出現滾動條
• 方法一：爲父容器設置隱藏橫向滾動條的樣式

overflow-x: hidden

• 方法二：爲父容器設置一定的padding，並且將box-sizing設置爲border-box，padding的設置根據你需要設置的間隔來定

padding: 0 10px;
box-sizing: border-box;