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

相关推荐
恋猫de小郭1 分钟前
让你的 OpenClaw 带你学习,清华开源 AI 私人导师 OpenMAIC
前端·人工智能·ai编程
石小石Orz11 分钟前
AI焦虑下,前端该何去何从
前端
用户4055948025011 分钟前
对组件内使用:deep()修改自身样式和样式穿透的记录
vue.js
何中应12 分钟前
<el-tree>标签问题
前端·vue.js·elementui
坚持学习前端日记12 分钟前
ComfyUI模型管理与集成方案
前端·人工智能·python
思慕很大很大15 分钟前
使用Vue开发,是不是不会出现XSS漏洞了?
vue.js·浏览器
En^_^Joy15 分钟前
JavaScript Web API:DOM操作全解析
开发语言·前端·javascript
咸鱼老弟16 分钟前
AI时代,告别焦虑,前端工程师的心态转变
前端·程序员
UXbot17 分钟前
APP原型生成工具测评
android·前端·人工智能·低代码·ios·开发·app原型
刘宇琪18 分钟前
如何在大型前端项目中有效管理 TypeScript 的类型复用与共享?
前端