如何輕鬆地將CSS元素置於頁面上使用CSS？

Question

我有一個表單，我希望直接位於頁面中間。我有這個CSS

#form { 
     width: 240px; 
     height: 100px 
     margin: 0 auto; 
     display: block; 
     } 

這隻能做到水平。有沒有辦法做到垂直？

Answer 1

我可能是錯的，但如果我沒有記錯..這應該工作：

#form { 
    width: 240px; 
    height: 100px 
    position: absolute; /* make sure this is wrapped by an element with "position: relative" */ 
    top: 50%; 
    left: 50%; 
    margin: -50px 0 0 -120px; /* half of the height and width */ 
    } 

如果我錯了，那麼你可能不得不使用JavaScript。

Answer 2

不是真的 - 您可以聲明頁面頂部的偏移量，但想一想......網頁有多高？垂直居中是什麼意思？

你想相對於打開的瀏覽器窗口高度居中嗎？或者相對於頁面的高度居中（頁眉頂部到頁腳底部，而不管瀏覽器窗口大小）。

在預覽中，原帖中的評論涵蓋了這一點。