element ui中select 下拉框在火狐浏览器最后一行显示不完全(谷歌正常)

在项目开发的时候用到了el-scrollbar组件 并且设置了隐藏横向滚动条
下面展示一些 内联代码片

// 隐藏横向滚动条
.el-scrollbar__wrap {
    
    
	overflow-x: hidden;
}
// 竖向
.el-scrollbar__bar.is-horizontal {
    
    
	height: 0 !important;
}

因为有以上设置 所以导致在火狐浏览器的时候最后select 下拉框最后一行总是显示不完全 所以解决方法如下
下面展示一些 内联代码片

.el-select-dropdown .el-scrollbar .el-scrollbar__wrap {
    
    
	overflow: scroll!important; // 记得加上!important
}

友情提示:1、以上涉及element ui的元素css在改动的时候请不要写在 sass · 或者 less里面 建议直接在下面重新写一个style标签 。
2、!important 记得一定加上 否则可能会导致不生效。
3、这种修改会涉及所有用到的同样的标签 即a和b页面都用了select 对a页面的select样式做了修改同样会影响b页面的select样式
4.如果不想影响全局可以使用/deep/ 博客另一篇文章有写附上链接
https://blog.csdn.net/miem_yang/article/details/119638729
下面展示一些 内联代码片

// 举个栗子
<style lang="less" scoped> </style> // 里面写本页面的css
<style> </style> // 里面写原生要修改的css

猜你喜欢

转载自blog.csdn.net/miem_yang/article/details/118970766