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

news2025/4/8 17:59:05

问题描述:

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

正常的样式:

异常的样式:

问题探索:

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

解决办法:

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

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

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

相关文章

mysql(三) 索引-普通索引、复合索引、索引规则等

上文我们学习了索引基础知识、所以我画了一个查询语句简单的执行流程、希望可以帮助大家一起学习。 目录 mysql select语句执行流程 普通索引 复合索引 创建索引(三种) 1、使用INDEX建表的时候创建索引 (创建表时建索引) INDEX的语法: …

osg-材质 (osg::Material)

1.材质类 材质类 (osg::Material)继承自osg::StateAttribute 类。osg::Material 封装了 OpenGL的 glMaterial()和glColorMaterial()指令的函数功能,其继承关系图如图5-27 所示。 图 5-27 osg::Material 的继承关系图 在场景中设置节点的材质属性,首先要…

VS2017 CMake编译Opencv

先下载opencv4.2.0源码以及opencv_contrib-4.2.0 地址链接:https://pan.baidu.com/s/1AgFsiH4uMqTRJftNXAqmTw?pwd3663 提取码:3663 先建立一个opencv_debug和opencv_release文件夹这两个都是为了后续存放编译好的debug版本和release版本opencv的&#…

APP自动化测试工具:八款推荐解析

uiautomator2 github地址:github.com/openatx/uia… UiAutomator 是 Google 提供的用来做安卓自动化测试的一个 Java 库,基于 Accessibility 服务。功能很强,可以对第三方 App 进行测试,获取屏幕上任意一个 APP 的任意一个控件属…

LeetCode---378周赛

题目列表 2980. 检查按位或是否存在尾随零 2981. 找出出现至少三次的最长特殊子字符串 I 2982. 找出出现至少三次的最长特殊子字符串 II 2983. 回文串重新排列查询 一、检查按位或是否存在尾随零 这题和位运算有关,不是很难,题目要求至少有两个数的…

基于SSM的新闻网站

末尾获取源码 开发语言:Java Java开发工具:JDK1.8 后端框架:SSM 前端:Vue 数据库:MySQL5.7和Navicat管理工具结合 服务器:Tomcat8.5 开发软件:IDEA / Eclipse 是否Maven项目:是 目录…

基于SSM的班级事务管理系统设计与实现

末尾获取源码 开发语言:Java Java开发工具:JDK1.8 后端框架:SSM 前端:采用Vue技术开发 数据库:MySQL5.7和Navicat管理工具结合 服务器:Tomcat8.5 开发软件:IDEA / Eclipse 是否Maven项目&#x…

WebSocket的优点和缺点:一文详解。

WebSocket 的优缺点 WebSocket 协议是一种双向通信协议,它使用单个 TCP 连接实现全双工通信,这使它比传统的 HTTP 协议更有效率。 WebSocket 优点 双向通信: WebSocket 协议支持双向通信,使服务器和客户端之间的通信更加方便和快…

googlecode.log4jdbc慢sql日志,格式化sql

前言 无论使用原生JDBC、mybatis还是hibernate,使用log4j等日志框架可以看到生成的SQL,但是占位符和参数总是分开打印的,不便于分析,显示如下的效果: googlecode Log4jdbc 是一个开源 SQL 日志组件,它使用代理模式实…

图像预处理——transforms

一、transforms 运行机制 torchvision是PyTorch的一个扩展库,提供了许多计算机视觉相关的工具和功能。下面是关于torchvision中常用模块的介绍: torchvision.transforms:提供了一系列常用的图像预处理方法,用于对图像进行变换、…

【生成人工智能】Ray如何解决生成人工智能基础设施的常见生产挑战

这是我们生成人工智能博客系列的第一部分。在这篇文章中,我们讨论了如何使用Ray来生产常见的生成模型工作负载。即将发布的一篇博客将深入探讨Alpa等项目为什么要使用Ray来扩展大型模型。 生成的图像和语言模型有望改变企业的设计、支持、开发等方式。本博客重点关…

Spring——Spring IOC(2)

1.Spring中的工厂类 1.1 ApplicationContext ApplicationContext的实现类,如下图: ClassPathXmlApplicationContext:加载类路径下 Spring 的配置文件FileSystemXmlApplicationContext:加载本地磁盘下 Spring 的配置文件 1.2 B…

基于Segformer实现PCB缺陷检测(步骤 + 代码)

导 读 本文主要介绍基于Segformer实现PCB缺陷检测 ,并给出步骤和代码。 背景介绍 PCB缺陷检测是电子制造的一个重要方面。利用Segformer等先进模型不仅可以提高准确性,还可以大大减少检测时间。传统方法涉及手动检查,无法扩展且容易出错…

体元法--体积计算

文章目录 环境:1.1 体元法介绍:2.1 python代码3.1 可视化 环境: Open3D 1.1 体元法介绍: 用一个个体素去占据点云,然后对所有体素求和 2.1 python代码 conda activete deeplabv3plus(环境名称–安装好open3D的) py…

python django 生鲜商城管理系统

python django 生鲜商城管理系统,包含用户端和管理端 功能: 用户端:商城主页展示,登录,注册,用户中心,购物车,我的订单,购物车结算 管理端:登录,商品&…

QT的坐标系统,回收机制、菜单栏,工具栏,状态栏,对话框及资源文件

QT的坐标系统,回收机制、菜单栏,工具栏,状态栏,对话框及资源文件 文章目录 QT的坐标系统,回收机制、菜单栏,工具栏,状态栏,对话框及资源文件1、QT的坐标系统?2、对象模型…

顶帽运算在OpenCv中的应用

项目背景 假如我们拍了一张自拍,想为自己的照片添加一个酷炫的火星飞舞的效果,素材库中正好有一张火焰的照片,如果想去除图中的火焰,只保留火星效果,可以使用顶帽子算法 图片中的火星部分正好属于比周围亮一些的斑块…

知虾皮Shopee:东南亚最受欢迎的电子商务平台

在如今数字化时代,电子商务平台成为人们购物的首选方式。Shopee作为东南亚地区最受欢迎的电子商务平台,通过其多样化的商品、便捷的购物体验和创新的商业模式,迅速在该地区占据了重要地位。本文将详细介绍Shopee的特点和优势,以及…

《作家天地》期刊投稿邮箱投稿方式

《作家天地》是国家新闻出版总署批准的正规文学刊物。对各种流派的作品兼收并蓄,力求题材、形式、风格多样化,适用于发表高品质文学学术作品,科研机构的专家学者以及高等院校的师生等。具有原创性的学术理论、工作实践、科研成果和科研课题及…

spug发布问题汇总记录

问题导览 1. [vite]: Rollup failed to resolve import "element-plus" from "src/main.js". 项目框架简介 vue3viteelement-plus 解决方案 - 1. 配置淘宝镜像源:npm config set registry https://registry.npm.taobao.org/ - 2. npm inst…