
盒子里的绝对定位元素发生预期外的像素偏移?
在自定义输入框选择框样式时,可能会遇到这样的问题:在不同的分辨率下,代码设置居中的选择框小元素在不同的分辨率下仍不居中。
问题原因
造成此问题的关键在于像素单位 (px) 在不同分辨率下可能产生移位。
解决方法
为了解决此问题,请将所有像素单位替换为相对单位,例如:
- 将宽度和高度的“15px”替换为“1rem”
- 将边框的“1px”替换为“0.1rem”
- 将小元素的大小(“10px”)替换为“0.6rem”
- 将小元素的边距(“-5px”)替换为“-0.3rem”
修改后的代码
修改后的代码如下:
通过这些改动,小元素的定位将独立于屏幕分辨率,始终居中对齐。










