IE9中的CSS垂直對齊問題

Question

我有一個文本按鈕（我使用Cuffon作爲文本），它必須垂直和水平居中。但是，文本對齊正在工作，但垂直對齊不起作用。

這裏是我的div塊：

btndownload 
{ 
    background-color: #512c1d; 
    background: url('../Images/Btn_Brwn.png'); 
    background-size: 103px 32px; 
    color: #B6BD00; 
    width: 103px; 
    font-family: 'Century Gothic'; 
    font-size: 13px; 
    font-weight: bolder; 
    border: 0 solid #512c1d; 
    margin-top: 6px; 
    height: 32px; 
    cursor: pointer; 
    text-align: center; 
    vertical-align: middle; 
    text-shadow: none; 
    padding-top:10px; 
    margin-right: -16px; 
    line-height:25px; 
} 

<div id="btnDownload" title="Download Image" class="btndownload"> 
    <cufon class="cufon cufon-canvas" alt="DOWNLOAD" style="width: 72px; height: 13px;"> 
    <canvas width="77" height="13" style="width: 77px; height: 13px; top: 1px; left: -1px;"> 
    </canvas><cufontext>DOWNLOAD</cufontext></cufon> 

與 「下載」 的文字現在按鍵垂直鍍鉻，IE10及以上，和Firefox，但不是IE9中心。

可能的錯誤可能是font-size :13 px但line-height:25px 有padding-top:10px;但它也是垂直居中。

Answer 1

我認爲這會工作

#btnDownload { 
     position: absolute; 
     width: 300px; 
     height: 200px; 
     top: 50%; 
     left: 50%; 
     margin-left: -150px; /* Negative half of width. */ 
     margin-top: -100px; /* Negative half of height. */ 
} 

與你的CSS的休息ofcourse一起。 *未在IE中測試，但在Chrome和Firefox中均可正確使用。