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导致行错乱问题

相关推荐
IT_陈寒14 小时前
Python开发者必看:5个被低估但能提升200%编码效率的冷门库实战
前端·人工智能·后端
g***789114 小时前
鸿蒙NEXT(五):鸿蒙版React Native架构浅析
android·前端·后端
q***718514 小时前
Webpack、Vite区别知多少?
前端·webpack·node.js
千里念行客24014 小时前
国产射频芯片“小巨人”昂瑞微今日招股 拟于12月5日进行申购
大数据·前端·人工智能·科技
你挚爱的强哥15 小时前
【sgSelectExportDocumentType】自定义组件:弹窗dialog选择导出文件格式word、pdf,支持配置图标和格式名称,触发导出事件
vue.js·pdf·word
小杨快跑~15 小时前
Vue 3 + Element Plus 表单校验
前端·javascript·vue.js·elementui
我叫张小白。16 小时前
Vue3监视系统全解析
前端·javascript·vue.js·前端框架·vue3
WYiQIU21 小时前
11月面了7.8家前端岗,兄弟们12月我先躺为敬...
前端·vue.js·react.js·面试·前端框架·飞书
谢尔登21 小时前
简单聊聊webpack摇树的原理
运维·前端·webpack
娃哈哈哈哈呀21 小时前
formData 传参 如何传数组
前端·javascript·vue.js