element.ui 自定义样式问题

 <el-button class="search_button" @click="search">查询</el-button>

 

.search_button {
    color: #ffffff;
    background: #15ac86;
    border: none;
    border-radius: 3px;

    &:hover,
    &:active,
    &:focus {
        color: #ffffff;
        background: #15ac86;
        border: none;
        border-radius: 3px;
    }
}                              

<el-input v-model="text" class="text-box"></el-input>
<style lang="less" scoped>
.text-box {
  /deep/ input {
    width: 166px;
    text-align: center;
  }
}

</style>