使用CSS垂直居中使用CSS

我目前正在使用CSS將頁面居中放置在一個wordpress站點上。我試圖在本網站上實施方法3，但沒有成功。使用CSS垂直居中使用CSS

網站：http://blog.themeforest.net/tutorials/vertical-centering-with-css/

使用兩種不同的div，一個與浮子的ID和一個與頁面包的ID I'm。我的CSS看起來像這樣

#floater { float: left; height: 50%; margin-bottom: -481px; } 

#page-wrap { clear: both; color: white; width: 1594px; height: 962px; margin: auto; position: relative; }

我也想指出的是，我的網頁，包裝DIV中我有很多其他的div建立我的設計（他們也浮到左，右）如果影響結果以任何方式。

鏈接的jsfiddle：http://jsfiddle.net/FERNX/

來源

2012-01-29 Sebastian

用你的例子創建一個jsfiddle – Petah 2012-01-29 00:25:01

在這裏，我希望它的作品。 http://jsfiddle.net/FERNX/ – Sebastian 2012-01-29 01:10:48

[CSS中的垂直中心元素]的可能重複（http://stackoverflow.com/questions/2023629/vertically-center-elements-in-css）。 SO和網絡的其他部分有這些問題的荒謬數目。 – Rob 2012-01-29 01:13:02

嘗試

#floater{ 
    margin-top: 25%; 
}

或

position: absolute; 
    top: 50%; 
margin-top: -25%;

來源

2012-01-29 00:24:16 theliberalsurfer

不幸的是，沒有做到這一點。 :( – Sebastian 2012-01-29 00:37:36

，如果你知道它的高度的最東部和簡單的解決方案是：

#page-wrap { position: absolute; height: 900px; top: 50%; margin-top: -450px; }

基本上它說;將其頂部定位在50％並減去其一半高度以使div的中心居中。

來源

2012-01-29 04:19:00 giorgio

使用CSS垂直居中使用CSS

回答

相關問題