一起offsetLeft值引发的样式错乱问题

问题描述:

首先我们来看一下正常样式和异常样式,正常样式的左侧菜单会正常显示出来,而异常样式的左侧菜单会被覆盖;

正常的样式:

异常的样式:

问题探索:

左边的间距其实跟通过读取最外层元素的offsetLeft来获取的;而最外层的元素和当前元素之间还嵌套这一些元素,而offsetLeft的值是获取它祖先级中第一个带position:relative就会停止向上查找了。

解决办法:

对比了一下正常样式和异常样式两种环境下访问的元素样式,发现第三方包antd的ant-modal-content样式中多了一个position: relative; 手动去掉之后就可以了,于是我们就怀疑是antd包的版本被改动了,还原antd包的版本之后,问题最终解决。

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

caj转换成pdf有哪些方法?

caj转换成pdf有哪些方法?PDF是一个被广泛支持的文件格式,这种格式基本上在所有的操作系统和设备上都是支持使用的,也能够将PDF文件打开和查看的,相比于caj文件,它就只能通过一下特定的软件或者是插件才能够将caj打开或…

C++ 实现对战AI五子棋

个人主页:日刷百题 系列专栏:〖C/C小游戏〗〖Linux〗〖数据结构〗 〖C语言〗 🌎欢迎各位→点赞👍收藏⭐️留言📝 ​ ​ 前言: 为了能够快速上手一门语言,我们往往在学习了基本语法后&#x…

gitlab 8.13.0 关闭注册功能

新版本基本都可以在网上找到关闭注册的教程,但是老版本会比较麻烦,可以通过如下路径在网页中设置(root 管理员登录) ​​​​​​http://ip:port/admin/application_settings 最后保存即可

python小工具之弱密码检测工具

一、引用的python模块 Crypto: Python中一个强大的加密模块,提供了许多常见的加密算法和工具。它建立在pyc.ypodome或pyc.ypto等底层加密库之上,为Python程序员提供了简单易用的API,使其可以轻松地实现各种加密功能。 commands…

CAAC无人机操作证考证报名流程及白底证件照片制作方法

在这个无人机技术日新月异的时代,拥有一张CAAC民用无人机操作证不仅意味着你能够合法地在天空翱翔,也象征着你对飞行技术的尊重和对规章制度的遵守。如果你怀揣着成为无人机飞行员的梦想,那么,让我们一起揭开CAAC民用无人机操作证…

FFmpeg之——获取上传视频的尺寸(长、宽)

获取上传视频的尺寸: 获取视频尺寸通常需要借助第三方库FFmpeg。 首先,确保你的系统中已安装了FFmpeg,并且FFmpeg的可执行文件路径已经添加到你的系统环境变量中。 1.官网下载ffmpeg 进入 链接: ffmpeg官网 网址,点击下载wind…

栈的经典算法问题(算法村第四关白银挑战)

括号匹配问题 有效的括号 20. 有效的括号 - 力扣(LeetCode) 给定一个只包括 (,),{,},[,] 的字符串 s ,判断字符串是否有效。 有效字符串需满足: 左括号必须用相同类…

2024.1.4每日一题

LeetCode每日一题 2397.被列覆盖的最多行数 2397. 被列覆盖的最多行数 - 力扣(LeetCode) 题目描述 给你一个下标从 0 开始、大小为 m x n 的二进制矩阵 matrix ;另给你一个整数 numSelect,表示你必须从 matrix 中选择的 不同 …

vue3 插槽 slot 使用

vue3 插槽 slot 使用 在 Vue3 中,插槽(slot)是一种重要的组件复用和内容分发机制。通过使用插槽,可以让组件更加灵活和具有可复用性,在不同的地方渲染不同的内容,同时保证相同的样式。 插槽资料 官网介绍&…

freertos——任务通知知识总结与任务通知模拟及信号量实验、消息邮箱实验、事件标志组实验

1.任务通知概念 任务通知:用来通知任务的,任务控制块中的结构体成员变量 ulNotifiedValue就是这个通知值,不需要另外创建一个结构体可以直接接受别人发过来的通知 2.任务通知的优势及劣势 任务通知的优势: 效率更高 &#xff…

Android开发中“真正”的仓库模式

原文地址:https://proandroiddev.com/the-real-repository-pattern-in-android-efba8662b754原文发表日期:2019.9.5作者:Denis Brandi翻译:tommwq翻译日期:2024.1.3 Figure 1: 仓库模式 多年来我见过很多仓库模式的实…