Question

我通过将页面内容包装在包装器div中然后将其放在样式表中来使页面内容居中：

#wrapper {
  width: 960px;
  margin-left: auto;
  margin-right: auto;
}

问题是：每当内容增加并且出现垂直滚动条时，它会替换内容，因为视口的大小已更改。无论滚动条的可见性如何，我们如何确保居中内容的位置不会发生变化？

Answer 1

因为当页面宽度发生变化时（滚动条出现时），您的内容相对于窗口大小（margin-left：auto; margin-right：auto）定位，因此内容的位置也会发生变化

为了解决此问题，您可以使用以下内容为页面上的内容指定绝对位置：postion:absolute

另一种选择是使用overflow-y property来指定是否剪切溢出到元素内容上的内容。

html {overflow-y:scroll;}