element el-table 设置fixed导致行错乱问题

首先看有问题的样式:

解决:

css 复制代码
// 解决左右 对不齐 的情况
// el-table 左右有列固定时,fixed为left和right时,行未对齐解决办法
// * 产生原因: el-table底部有滚动条,固定列底部没有滚动条
// * 解决办法: 在el-table的表格中设置padding-bottom的内边距跟滚动条等高
/deep/.el-table__fixed,
/deep/.el-table__fixed-left,
/deep/.el-table__fixed-right {
  // 10 是我这里全局定义的滚动条的高度
  height: calc(100% - 10px) !important;
}

/deep/.el-table__fixed-body-wrapper {
  height: 100% !important;
}

/deep/.el-table__fixed-body-wrapper .el-table__body {
  /*滚动条高度*/
  // 10 是我这里全局定义的滚动条的高度
  padding-bottom: 10px !important;
}

el-table 左右有列固定时,fixed为left和right时,行未对齐解决办法

  • 产生原因: el-table底部有滚动条,固定列底部没有滚动条
  • 解决办法: 在el-table的表格中设置padding-bottom的内边距跟滚动条等高

参考:
el-table 设置fixed导致行错乱问题

相关推荐
KongHen029 分钟前
uniapp-x实现自定义tabbar
前端·javascript·uni-app·unix
数据潜水员9 分钟前
三层统计最小力度的四种方法
javascript·vue.js
汪子熙9 分钟前
TS2320 错误的本质、触发场景与在 Angular / RxJS 项目中的系统化应对
前端·javascript·angular.js
我命由我1234526 分钟前
React - BrowserRouter 与 HashRouter、push 模式与 replace 模式、编程式导航、withRouter
开发语言·前端·javascript·react.js·前端框架·html·ecmascript
Younglina33 分钟前
用AI全自动生成连环画?我试了,效果惊艳!
前端·ai编程·claude
Devin_chen39 分钟前
ES6 Class 渐进式详解
前端·javascript
小番茄夫斯基39 分钟前
前端开发的过程中,需要mock 数据,但是走的原来的接口,要怎么做
前端·javascript
peachSoda71 小时前
前端想转AI全栈-初步练习记录
前端·人工智能
树上有只程序猿1 小时前
低代码平台选型指南,10 款热门工具对比
前端·后端
@PHARAOH1 小时前
WHAT - 硬链接 hard link 和软链接 symlink
前端