css - 包装器上的跨浏览器对齐问题

Question

Here是我正在谈论的网站的链接。

我的问题是，当您在主导航中的不同页面之间导航时，主包装器不会在我使用的不同页面上对齐。因此，如果您在主页上并单击主导航栏中的“WMH”，整个页面将向左跳约 8 像素。

这会在我的客户非常不喜欢的页面之间造成抖动。我在 css 中使用了一些 padding-left 和 padding-right 来正确对齐它。不幸的是，当我在 Firefox 中获得像素完美时，它在 Chrome 和 Safari 中是错误的。如果我在 chrome 中获得像素完美，它在 Firefox 中会抖动。这很烦人。我不想为 Chrome、Firefox、IE、Safari 编写单独的样式，除非它确实是唯一的解决方案。

感谢您的反馈。 阿奇。

Answer 1

浏览器滚动条看起来是造成这种情况的原因。您可以强制滚动条始终出现，这样可以解决问题。将此添加到您的 CSS:

html {overflow-y: scroll;}

一旦上述样式出现在您的 CSS 中，您可能还需要删除最初尝试解决问题的填充。