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

解决过程

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

相关推荐
镜宇秋霖丶5 天前
2026.5.12@霖宇博客制作中遇见的问题
前端·vue.js·elementui
镜宇秋霖丶8 天前
2026.5.10@霖宇博客制作中遇见的问题
前端·vue.js·elementui
莫生灬灬8 天前
ElementUI封装 共91个组件 支持易语言/火山/C#/Python
开发语言·c++·python·ui·elementui·c#
镜宇秋霖丶9 天前
2026.5.8@霖宇博客制作中遇见的问题
前端·vue.js·elementui
MXN_小南学前端10 天前
Vue + Element UI 分页器封装:比直接用 el-pagination 更省心的通用方案
javascript·vue.js·elementui
invicinble10 天前
前端框架使用vue-cli( 第二层:工程配置层--elementui需要做的基础配置)
vue.js·elementui·前端框架
周bro13 天前
vue2+element ui 中的el-table表格 选中当前行当前行变色,单选/多选--------续集:表格样式修改整合
vue.js·ui·elementui
T畅N13 天前
审批流设计器(前端)
前端·elementui·vue·html·流程图·js
abcnull13 天前
Springboot+Vue2的Web项目小白入门Demo快速学习!
java·elementui·vue·maven·springboot·web·小白
abcnull15 天前
传统的JavaWeb项目Demo快速学习!
java·servlet·elementui·vue·javaweb