保证金自动变为负值

Question

我有保证金问题：自动 - 垂直居中 #something { width: 97%; height: 300px; border: 1px solid red; position: absolute; top: 0; bottom: 0; margin: auto; }

这项工作在每个现代浏览器中 - 当页面（视口）高于300px时，它垂直居中，但是，当页面（视口）较低时300px停止它除了在firefox中以外的任何地方工作...在firefox中运行它很好（可能是功能不好，但它的逻辑功能）在其他浏览器中，居中元素的顶部在视口顶部消失。

http://jsfiddle.net/LhHed/2/这是上帝的例子 - 当你调整结果窗口大小时，在firefox中工作得很好，在其他浏览器中没有。是否可以修复它？或者它的Firefox功能不好？

编辑：实例http://dev8.newlogic.cz

Answer 1

从我收集的内容来看，您希望分隔符的顶部显示在页面顶部。这当前没有发生，因为您将位置设置为top:0; bottom:0;，top属性与bottom属性冲突，最终将分隔符定位到页面底部。只需删除bottom属性，即可防止元素的顶部出现在视口外：

#something {
    width: 97%;
    height: 300px;
    border: 1px solid red;
    position: absolute;
    top: 0;
    margin: auto;
}

JSFiddle

Answer 2

当我将position: relative用于body元素时，我在浏览器中删除了该问题。现在它也在firefox和其他浏览器中工作。 http://dev8.newlogic.cz

上的实例