將一段文字垂直居中放置在一個div內

Question

我已經看到如何做到這一點，但他們都不適合我。我試圖將我的名字置於div（標識爲「.banner」）中。

下面是代碼：

//html/////////////////////////////////// 
<div class="banner"> 
    <p>Jake Demian_</p> 
</div> 


//css//////////////////////////////////// 
.banner 
{ 
    width: 100%; 
    height: 400px; 
    background-color: #e8bc23; 
    text-align: center; 
} 

.banner p 
{ 
    display: inline-block; 
    font-family: "courier new"; 
    margin: 0 0; 
    height: 100%; 
    vertical-align: middle; 
} 

的jsfiddle鏈接：linkage

很抱歉的最少信息。我已經嘗試了我能想到的inline-block，vertical-align: middle,height 100%,margin: auto的所有組合。

Answer 1

嘗試增加：

top:45%; 
position:relative; 

到.banner p。

您也可以嘗試加入：

display: table; 

到.banner和

display: table-cell; 

到.banner p。

JSFiddle：http://jsfiddle.net/BTjr7/2/