【记录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>

解决过程

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

相关推荐
咔叽布吉11 小时前
【前端】ElementPlus表单数组形式数据自定义校验(必填)
前端·elementui
布兰妮甜13 小时前
封装Element UI中el-table表格为可配置列公用组件
vue.js·ui·el-table·前端开发·element-ui
几度风雨见丹心16 小时前
vue+elementUI 进行表格行内新增及校验,同行其他输入框数据影响当前输入框校验结果
前端·vue.js·elementui
ikun778g4 天前
elemen ui Table表格中添加图片
前端·ui·elementui
程序员的世界你不懂4 天前
【Flask】测试平台开发,应用管理模块实现-第十一篇
vue.js·elementui·flask
chxii4 天前
7.2elementplus的表单布局与模式
javascript·vue.js·elementui
太过平凡的小蚂蚁6 天前
Kotlin 协程作用域
vue.js·elementui·kotlin
小只笨笨狗~7 天前
el-dialog宽度根据内容撑开
前端·vue.js·elementui
爱学大树锯8 天前
【Ruoyi 解密 - 08. 前端探秘1】------ 从“交互原理”到“开发逻辑”,后端也能看懂的前端实战指南
前端·elementui·vue
chxii11 天前
6.3Element UI 的表单
javascript·vue.js·elementui