垂直居中后滚动不正确

Question

为我的主要内容设置位置absolute; top: 50%; margin-top: -310px后，我遇到了问题。问题是当我最小化浏览器窗口并且出现垂直滚动时，布局的顶部部分被隐藏。

这就是我的意思：http://jsfiddle.net/95Uzt/15/。您可以看到菜单和联系表单，但浏览器无法看到/覆盖表单上方的标题。有什么问题？

Answer 1

我认为你试图用一段代码处理两个案例，而这只是不起作用。您将需要使用某种条件代码来处理这两种情况。

你的两个案例是：

• 对于超过620像素的视口，您需要将内容居中
• 对于小于620像素的视口，您需要顶部对齐的内容。

对于支持它的更现代的浏览器，您可以考虑使用CSS：

@media screen and (max-height: 620px) {  
  .content
  {
    top: 0px;
    margin-top: 0px;
  }
}

如果您需要更广泛的浏览器支持，我认为您需要使用javascript。