vue2+elementui的el-table固定列会遮住横向滚动条以及错位

解决方案

我是最右侧固定列,所以下面的class名称是.el-table__fixed-right, 如果有左侧固定请自行替换为el-table__fixed

防止固定列表格高度错位

javascript 复制代码
  .el-table__fixed-body-wrapper {
    .el-table__body {
      padding-bottom: 15px; // 这个得自己调试看多少合适
    }
  }
}

如果还没有解决错位, 请看你的el-table__body-wrapper是不是自己写了max-height的样式属性, 这会影响固定列定位的

解决固定列错位后, 接下来就是吧固定列往上提滚动条的高度就不会影响了

javascript 复制代码
  .el-table__fixed-right {
    height: auto !important;
    bottom: 8px !important;// 这个得自己调试看多少合适
  }
   //去掉固定列下方的横线, 样式优化
  .el-table__fixed::before, .el-table__fixed-right::before {
    display: none;
  }

解决效果如图:

留出了高度并且高度一致没有错位

问题完美解决!!!

相关推荐
溪语流沙1 小时前
【每天一个CSS | Day33】聚焦即弹出的命令面板
前端·css·html5·组件·每日一练
燕落南枝2 小时前
CSS 用户行为伪类::hover 与 :focus 详解
前端·css
风骏时光牛马2 小时前
业务基础信息管理库
前端
软件技术NINI2 小时前
基于JavaWeb 汽车租聘
java·vue.js·spring boot·后端·python·毕业设计·毕设
zyxqyy&∞2 小时前
sqli-labs-布尔盲注 (Less-8),时间盲注 (Less-9~10)
前端
m0_敲代码的彭于晏1689 小时前
Vercel 前端部署平台深度评测
前端
2301_32241428049 小时前
基于SpringBoot+Vue的休闲零食超市管理系统的设计与实现59004-计算机毕设 原创(免费领源码+部署教程+开发环境)
java·vue.js·spring boot·redis·mysql·决策树·推荐算法
怕浪猫10 小时前
外包和大厂的前端代码,差在凌晨三点
前端·面试·github
m0_敲代码的彭于晏16811 小时前
Vercel 前端部署与全栈开发实战指南
前端·状态模式
徐小夕11 小时前
花了3个月,我们做了一款 AI 版的“飞书文档”
前端·算法·github