保證金自動變爲負值

Question

我有問題，保證金：汽車 - 垂直居中 #something { width: 97%; height: 300px; border: 1px solid red; position: absolute; top: 0; bottom: 0; margin: auto; }

這項工作在每一個現代瀏覽器 - 網頁時（視）是高於300像素，它的垂直居中，但是，當該頁面（視口）是低於300px停下來，除了在Firefox中的其他地方工作...在Firefox中運行它很好（也許它是壞的functionitiy，但其邏輯功能）在其他瀏覽器的頂部居中元素消失在視口的頂部。

http://jsfiddle.net/LhHed/2/這裏是上帝的例子 - 當你調整結果窗口，在Firefox中工作得很好，在其他瀏覽器中沒有。是否可以修復它？或者它的Firefox功能不好？

編輯：活生生的例子http://dev8.newlogic.cz

Answer 1

我刪除了瀏覽器中的問題，當我使用position: relative到body元素。現在它在Firefox和其他瀏覽器中工作。現場示例http://dev8.newlogic.cz

Answer 2

從我所收集，你想要的間隔物的頂部在頁面的頂部顯示。目前沒有發生這種情況，因爲您將位置設置爲top:0; bottom:0;，top屬性與bottom屬性衝突，最終將分隔符置於頁面底部。簡單地移除bottom屬性不允許出現在檢視區外的元件的頂部：

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

JSFiddle。