使用CSS在IE中不工作的文本居中使用

Question

我在使表中的文本出現在IE中居中時遇到問題。

在Firefox 2，3和Safari都做工精細，但由於某種原因，文本沒有出現在IE 6居中或7

我使用：

h2 { 
    font: 300 12px "Helvetica", serif; 
    text-align: center; 
    text-transform: uppercase; 
} 

我我也試過添加margin-left:auto;,margin-right:auto和position:relative;

無濟於事。

Answer 1

表格單元格需要text-align：center。

Answer 2

text-align: center應該是足夠的，因爲您將文本居中在塊元素（h2）中 - 調整邊距將改變塊的位置，而不是文本。

我不知道是不是隻是IE瀏覽器有一個虛擬唾沫font聲明你有嗎？

Answer 3

在圍繞h2的div/td中使用text-align：center。

<table style = "width:400px;border:solid 1px;"> 
    <tr> 
     <td style = "text-align:center;"><h2>hi</h2></td> 
    </tr> 
</table> 

編輯：哇，stackoverflow的社區相當快！

Answer 4

應該在父元素上聲明CSS文本對齊屬性，而不是要嘗試居中的元素。 IE使用text-align：center屬性來居中文本。 Firefox使用margin：0 auto，並且它必須在您嘗試居中的元素上聲明。

<div style="text-align: center"> 
    <h2 style="margin: 0 auto">Some text</h2> 
</div> 

Answer 5

可能是一個錯字，但你在這裏失去了分號：

margin-left:auto; margin-right:auto position:relative; 

應該是：

margin-left:auto; margin-right:auto; position:relative; 

如果不工作，確保元素你是試圖將文本居中放在一定寬度上。嘗試將寬度設置爲100％，看看是否有任何變化。

Answer 6

如果您可以/想要使用flexbox，也可以使用以下內容。

display: flex; 
justify-content: center; 
align-items:center