element-ui中select和input的宽度不一致

今天写页面的时候用的是element-ui组件，其中用到了form表单，在页面中显示的效果是select组件要比input组件要长一点，美观度就有点不太好，效果如下图所示：

于是就想让input和select的宽度一致，首先找到了一种方法说是修改select的宽度，代码如下：

<el-form-item label="所在国家:" prop="title">
  <el-select v-model="ruleForm.county" placeholder="请选择国家" style="width:100%">
    <el-option v-for="item in country" :key="item.dictValue" :label="item.dictLabel" 
     :value="item.dictValue">
    </el-option>
  </el-select>
</el-form-item>

运行代码9以后，并没有什么改变，于是就有了第二种方法，说input与select之间缺少一个图标，

于是就有了以下代码：

<el-form-item label="标题:" prop="title">
  <el-input v-model="ruleForm.title" @change="fu($event)" @ready="ready" placeholder="请输入标题" suffix-icon=“xxxx”></el-input>
</el-form-item>

这次再运行一下代码，确实可以了，我想要的效果如下：