IE：中間垂直對齊表

我的頁面水平和垂直居中，頁面適用於所有瀏覽器，但對於IE，頁面只適用於IE11（最新）。在IE 10,9和8中，表格在頁面頂部垂直對齊。如何在IE 10,9和8中進行垂直對齊工作，需要更改哪些內容？IE：中間垂直對齊表

的Html

<body> 
<div class="container"> 
    <div class="content"> 
    <table width="350px"> 
     <tr> 
      <td> 
       <img border='0' src='https://upload.wikimedia.org/wikipedia/commons/a/a5/Information_example_page2_300px.jpg' width='300' height='300' style="margin:25px 25px 50px 25px;"> 
      </td> 
     </tr> 
     <tr> 
      <td align="center"> 
       <p style="margin: 0px 0px 50px 0px;">Street<br> 
        0000AA City 
       </p> 
      </td> 
     </tr> 
     <tr> 
      <td align="center" class="contact"> 
       <p style="margin: 0px 0px 50px 0px;"> 
        <span style="color:#DDB4A4;">T</span>&nbsp; <a href="tel:000000">000000</a><br> 
        <span style="color:#DDB4A4;">E</span>&nbsp; <a href="mailto:[email protected]">[email protected]</a><br> 
       </p> 
      </td> 
     </tr> 
     <tr> 
      <td align="center"> 
       <p style="color:#999999; margin: 0px 0px 25px 0px; font-size: 16px;">Text</p> 
      </td> 
     </tr> 
    </table> 
    </div> 
</div> 
<body>

的CSS

html, body 
    { 
     margin: 0; 
     padding: 0; 
     width: 100%; 
     height: 100%; 
     display: table; 
    } 
    .container { 
     display: table-cell; 
     text-align: center; 
     vertical-align: middle; 
    } 
    .content { 
     display: inline-block; 
     text-align: left; 
    } 
    table { 
     font-size:18px; 
     font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; 
     color: #4D4D4D; 
    } 
    .contact a:link 
    { 
     color: #4D4D4D; 
     text-decoration: none; 
    } 
    .contact a:hover 
    { 
     color: #1a0dab; 
     text-decoration: underline; 
    }

的jsfiddle：https://jsfiddle.net/64ys7j6n/

來源

2015-10-29 Sybren

舊的IE無法處理display:table爲HTML和身體非常好。此外，這不是必需的。

解決方法：請勿將display:table指定爲html，僅限於body。 html只需要height:100%。

html { 
    height:100%; 
} 
body 
{ 
    margin: 0; 
    width: 100%; 
    height: 100%; 
    display: table; 
}

New fiddle

來源

2015-10-29 08:27:00

現在，表是在每一個瀏覽器的頂部對齊，我想表是垂直的中間對齊。 – Sybren

任何想法解決它？ – Sybren

哦，我很抱歉，我沒有足夠的咖啡顯然。我有它的工作，然後我發佈之前刪除未使用的CSS。但它並沒有真正被使用！所以我編輯了答案並糾正了它。對於那個很抱歉。 –

IE：中間垂直對齊表

回答

相關問題