【记录52】el-table-column 添加fixed属性 滚动条无法滑动

问题: el-table-column 添加fixed属性 滚动条无法滑动

使用element UI组件,用到el-table的el-table-column的fixed属性时,当滚动条长度小于固定列时,滚动条无法通过鼠标去点击滑动操作

原因

fixed是用来固定列的属性,其的展现层级会高于滚动条的层级,因此会导致该问题,但使用z-index层级是无法起到效果的

解决方案

css 复制代码
<style>
/* 设置默认高度-滚动条高度 */
.el-table__fixed {
  height: calc(100% - 15px) !important;
}
/* 用于消除固定列下方的伪元素边框线 */
.el-table__fixed:before {
  height: 0px;
}
</style>

解决过程

查找了很多资料,有的方法是可行的,有的不可行,可行的有的样式太多了,该方法用极短的样式就可以解决,笔者亲测有效

相关推荐
招风的黑耳10 小时前
ElementUI元件库——提升Axure原型设计效率与质量
前端·elementui·axure
油丶酸萝卜别吃1 天前
springBoot与ElementUI配合上传文件
spring boot·后端·elementui
Jiaberrr2 天前
介绍几种创意登录页(含完整源码)
前端·javascript·css·elementui·css3
零点七九2 天前
sortablejs el-table 树结构拖拽
javascript·vue.js·elementui·sortablejs
兰德里的折磨5502 天前
对于后端已经实现逻辑了,而前端还没有设置显示的改造
前端·vue.js·elementui
梦想家加一3 天前
elementUI el-image图片加载失败解决
javascript·vue.js·elementui
奶球不是球3 天前
el-tree自定义内容
javascript·vue.js·elementui
康6203 天前
vue2中引入elementui
前端·javascript·elementui
听风说雨的人儿3 天前
ElementUI时间选择、日期选择
前端·javascript·elementui
资深前端攻城狮3 天前
el-tree-select选项数据无法回显
前端·vue.js·elementui