el-input中的el-input__suffix行高问题

el-input中的el-input__suffix样式问题

在使用el-element开发时,使用到了el-input组件,添加了clearable属性,由于业务要求更改了样式,但问题出来了,el-input默认的高度是40px,我这里改成了32px,外表看起来没啥问题,但将光标移到el-input上面并输入一些内容,出现el-input__suffix图标,会发现它的行高有点偏下。
在这里插入图片描述
el-input在这里的高度是32px,我希望el-input__suffix图标的行高也是32px,这样看起来就要对齐一些。可是从控制台定位不到这个元素,因为鼠标一移开,它就消失。还好,这类图标通常是用 i 标签包裹着,那么可以这样:

::v-deep .el-input__suffix i {
    line-height: 32px;
}

搞定行高问题。

  • 3
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值