【el-table】横向滚动条加粗后,滚动到固定列下被遮挡,已解决

news2024/12/21 19:59:15

在这里插入图片描述
横向滚动条按要求加粗后,遇到的问题:列表的操作列是固定在最右侧的,当滚动条滑动到最右侧的时候,滚动条被遮挡了

我尝试了几种方法都不行,比如找到.el-table__fixed-right .el-table__fixed-footer-wrapper ,修改bottom的值,无效

解决方法:
首先,el-table设置了固定列之后,会有两套不同的列名
在这里插入图片描述

如截图所示,普通列body的高度是362px(含横向滚动条12px的高度)
在这里插入图片描述
在这里插入图片描述
而固定列body的高度是354px
在这里插入图片描述
看红色圈起来的部分,固定列的body高度其实超了,所以挡住了滚动条
在这里插入图片描述
固定列body的高度等于普通列body的高度 - 横向滚动条的高度
按示例的普通列高度362px - 横向滚动条的高度12px = 350px
所以固定列的body高度改为350px

/deep/ .el-table__fixed-body-wrapper{
  height: 350px !important;//el-table__body-wrapper高362  - 横向滚动条12 = 350
}

现在就不遮挡了
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2041499.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

LoadRunner12添加集合点

集合点的含义和意义: 集合点用于保证真正的并发。当脚本运行到集合点函数时,将停止运行并等待其允许运行的条件(即集合点策 略),达到后才释放集合点开始运行。用来分析软件性能瓶颈。 一般将集合点放在开始事务代码之前。 通常来说集合点不需…

Vue2 axios

1.安装引入 axios npm i axios 2.配置代理 1.配置代理(方式一) module.exports {devServer: {proxy: http://localhost:5000} } 1.发送ajax请求 getStudent(){axios.get(http://localhost:8080/students).then(res>{console.log(请求成功了,res.data);},error>{co…

大咖公开课 | AI自动化应用开发,让创意与效率并驾齐驱!

在这个日新月异的时代,人工智能(AI)与自动化技术的融合正以前所未有的速度重塑着各行各业。你是否梦想过,在信息的海洋中自动筛选出精华,用创意点亮每一篇内容,同时让繁琐的工作流程变得轻松高效&#xff1…

丰收季遇科技之光:北斗卫星导航引领现代农业新篇章

在这个金风送爽、硕果累累的丰收时节,广袤的田野上洋溢着农民们欢声笑语,每一粒饱满的果实都是大自然与辛勤耕耘者的共同馈赠。而在这片希望的田野上,一项科技革命的浪潮正悄然改变着传统农业的面貌——北斗卫星导航系统,正以它精…

Win10电脑怎么开启远程桌面?

在工作中,远程连接是一种常见的操作需求,而在Windows系统中提供远程连接功能。然而,Windows自带远程控制功能需要电脑设置允许远程连接,才能进行远程控制。那么,Win10如何设置允许远程连接?Win10开启远程桌…

一次异常艰难的渗透测试

0x01 暴力破解 朴实无华的弱口令,我都怀疑是不是交互式蜜罐。 0x02 文件上传 该系统所有文件上传功能均通过同一方式进行上传。 文件列表,可以看到文件上传后,从文件列表处能看到FileDirFilePath为文件路径的存放路径,文件名为G…

mybatis-plus执行delete时报错Prohibition of full table deletion

1.由于mybatis预防全表删除,所以会报错,想要执行全表数据删除需要加注解 2.同时执行语句修改为注解的sql语句 InterceptorIgnore(blockAttack "true")

Python利用xlrd复制一个Excel中的sheet保留原格式创建一个副本(注:xlrd只能读取xls)

目录 专栏导读库的介绍库的安装完整代码总结 专栏导读 🌸 欢迎来到Python办公自动化专栏—Python处理办公问题,解放您的双手 🏳️‍🌈 博客主页:请点击——> 一晌小贪欢的博客主页求关注 👍 该系列文…

阿里云无影?云电脑有心

很高兴收到了阿里云无影云电脑的测试邀请,试用结果让我非常惊讶。我通过该产品看到,阿里云“又”要开拓出一个千亿级的云电脑市场——为什么要说“又”?因为“就”是他们带头开拓了千亿级的公有云市场啊。 本文不仅是在帮企业用户做选型分析&…

npm error,淘宝源过期,切换源

npm error,淘宝源过期,切换源 npm ERR! request to https://registry.npm.taobao.org/file-saver failed, reason: certificate has expired 淘宝源过期,切换源:流水线配置: sh:"npm config set registry https:…

玩转haproxy --花十分钟看看,全是干货

Haproxy是一款开源集群软件(在上一篇文章中提到过集群的相关知识,往期点击http://t.csdnimg.cn/qWtQG)是法国开发者 威利塔罗(Willy Tarreau) 在2000年使用C语言开发的,是一款具备高并发(万级以上)、高性能的TCP和HTTP负载均衡器 …

有道云docx转换markdown,导入hugo发布到github page,多平台发布适配

版权归作者所有,如有转发,请注明文章出处:https://cyrus-studio.github.io/blog/ 有道云导出docx 有道云笔记右上角更多按钮选择【导出为Word】,可以导出docx文档 docx转换markdown 尝试了几个docx转markdown的python库后&…

1.2 数据库管理系统的基本原理

欢迎来到我的博客,很高兴能够在这里和您见面!欢迎订阅相关专栏: 工💗重💗hao💗:野老杂谈 ⭐️ 全网最全IT互联网公司面试宝典:收集整理全网各大IT互联网公司技术、项目、HR面试真题.…

子网掩码是什么?

子网掩码(Subnet Mask)是用于划分网络的一个32位的二进制数,用于指示IP地址中哪些位用于网络标识,哪些位用于主机标识。 在IPv4网络中,IP地址由32位二进制数组成,通常表示为四个十进制数,每个数…

Leetcode—1006. 笨阶乘【中等】

2024每日刷题&#xff08;156&#xff09; Leetcode—1006. 笨阶乘 实现代码 class Solution { public:int clumsy(int n) {stack<int> st;st.push(n);n--;int idx 0;while(n ! 0) {if(idx % 4 0) {int num st.top() * n;st.pop();st.push(num);} else if(idx % 4 …

plsql如何连接sql server?plsql连接oracle数据库如何配置

在当今企业数据管理和应用开发中&#xff0c;数据库的互联互通已成为常态。特别是在多数据库环境下&#xff0c;如Oracle和SQL Server的结合使用&#xff0c;为企业提供了更广阔的数据处理能力。PL/SQL作为Oracle数据库的过程化扩展语言&#xff0c;能够高效地管理Oracle数据库…

应急响应:病毒处理的方法---实战案例.(手动版)

什么是应急响应. 一个组织为了 应对 各种网络安全 意外事件 的发生 所做的准备 以及在 事件发生后 所采取的措施 。说白了就是别人攻击你了&#xff0c;你怎么把这个攻击还原&#xff0c;看看别人是怎么攻击的&#xff0c;然后你如何去处理&#xff0c;这就是应急响应。 目录&…

带你速通C语言——位运算符、结构运算符与指针运算符(5)

位运算符、结构运算符与指针运算符 C语言的位运算符、结构运算符和指针运算符是对数据的更底层操作&#xff0c;使得C语言尤其适合进行系统编程和处理复杂的内存管理任务。下面详细介绍这些运算符。 1.位运算符 位运算符作用于整数类型的操作数的二进制位。以下是C语言中可用的…

报SBAT self-check failed: Security Policy Violation突然开不了机

台式机一直用的好好的没什么问题&#xff0c;早晨突然开机就关机提示&#xff1a; 查了一下网上资料&#xff0c;在BIOS里面搜“安全启动”改为禁用就行&#xff0c;该电脑微星主板直接由开启改为禁用&#xff0c;重启进入系统。很奇怪&#xff0c;一直用的没啥&#xff0c;突然…

Spring AOP应用指南:概念、通知与表达式分析

目录 一.AOP的基础概念 二.Spring AOP的应用场景 三.Spring AOP的核心概念 ▐ 切点(Pointcut) ▐ 连接点(Join Point) ▐ 通知(Advice) ▐ 切面(Aspect) 通知类型 四.PointCut与Order 切面优先级 五.切点表达式 execution(...)表达式 annotation表达式 一.AOP的基…