顯示錶不是垂直居中文本移動

CSS

.table{ 
    display:table; 
    height:100%; 
    width:100%; 
} 

.table-cell{ 
    display: table-cell; 
    vertical-align: middle; 
}

HTML

<div class="table"> 
<div class="table-cell"> 
    <a class="cta cta-1" href="#">Shop Now</a> 
</div>

它垂直居中文本上正確桌面，但我試着在我的手機上查看它（IPhone），它不起作用，文本是al登頂。爲什麼會這樣？你可以在這裏看到它。 http://machinas.com/wip/stradviarius/startpage/

另請參閱：http://blog.themeforest.net/tutorials/vertical-centering-with-css/。他們包括你正在嘗試（這不適合我，順便說一句），但也有其他建議。 –

在我的桌面上的Chrome中，它也不起作用。 –

它看起來像你的網站上沒有任何你包含在你的問題中的CSS。 –

如果您使用不會改變，你可以用做固定的內容：

.table-cell{ 
    display: table-cell; 
    margin-top:170px; 
}

OR使用line-height文本（可能是最好的）：

.cta { 
    line-height:339.328px; 
}

339.328 PX是從你的div高度。

注意：您的網站不會垂直居中我Chromebook上的文字，所以我認爲它不起作用。

2014-04-25 14:05:48 Vagish

寧願不設置固定的高度。 – user1937021

回答