CSS，頂部，底部事業部以及居中水平事業部

Question

<div id="site_wrapper"> 
<div id="top"><?=$top?></div> 
<div id="wrapper"> 
<div id="login_wrapper"> 
<?=$content?> 
</div> 
</div> 
<div id="footer"><?=$footer?></div> 
</div> 

凡

$top should be drawn on the very top of the page. 
$content should be centered both vertically and horizontally of the page. 
$footer should be drawn on the very bottom of the page. 

我不希望任何的div的跟隨觀點，我發現了一個問題兩種解決方案的一個，但沒有一個可以將它們結合起來，因爲它們都具有CSS中的高度元素。所以首先我猜如果它是可能的（我想它是），那麼第二是當然，怎麼樣？

編輯：非常喜歡這一面，頂部的酒吧應該始終在頂部，一個相當簡單。

然後，#login_wrapper應該始終以固定的高度居中放置。

最後腳註應該總是在底部（它應該被推不粘），因爲在這種情況下#login_wrapper不會填寫網站。

#top和#footer都有固定的高度。

編輯2：修正了一些問題的解釋。從本網站[鏈接] http://stackoverflow.com/questions/7909587/horizo​​ntal-and-vertical-centering-above-a-sticky-footer-in-css
還是要謝謝你

找到解決方案！

Answer 1

如果我明白你的問題，嘗試用這個CSS

#site_wrapper 
{ 
position: relative; 
} 

#top 
{ 
position: relative; 
top: 0px; 
} 

#footer 
{ 
position: relative; 
bottom: 0px; 
} 

#wrapper 
{ 
position:relative; 
vertical-align: middle; 
height: 100%; 
} 

#login_wrapper 
{ 
/* add some height */ 
}