css - 在 Chrome 上缩放会导致 CSS 定位问题

Question

当我在谷歌浏览器中放大和缩小我的网页时，相互精确定位的项目会改变位置。这会导致很多问题：例如，在特定的缩放级别，一个 div 将与其包含的 div 重叠，刚好足以隐藏一个边框。同样，有时 100% 标记不会与 100% 点精确对齐。

有什么方法可以确保页面放大或缩小时项目之间的相对位置不会改变？

Answer 1

您可以使用 em 定位，它将根据字体大小重新定位和大小。因此，当人们喜欢 control + 或 command + 时，页面将自动调整大小。这是一个关于弹性布局的页面。希望这可以帮助。

http://v1.jontangerine.com/log/2007/09/the-incredible-em-and-elastic-layouts-with-css

Answer 2

根据我的经验，使用left:px 值和top:与左/右下/下或右/上相比的 px 值似乎可以解决问题。这适用于 Chrome 和 FF，不能评论 IE。

例如：

#my-element
{
  list-style-type: none;
    position: fixed;
    left: 54px;
    top: 40px;
}

Answer 3

虽然这是一个老话题，但我偶然发现了这个问题。通过将包装容器添加到“难以捉摸的”元素来修复。因此，在尝试修复元素 css 之前，可能首先检查并确保内容包装器。