IE8 vs IE7 html格式化

我一直在努力讓div容器元素與它的子內容一起居中，並開始變得令人沮喪。直列式造型我有格如下：IE8 vs IE7 html格式化

<body id="body1" style="vertical-align: middle; text-align: center"> 
     <div id="container" style="position: relative; width: 910px; margin: 0px auto;"> 
      <!---Child Content--->  
    . 
    . 
. 
</div> 
    </body>

當這些設置在IE7被視爲，在div容器抵銷向右作爲下面PIC所示：

enter image description here

爲了居中我來補充其位置的風格定義正確的屬性，以推動其向中心：

<body id="body1" style="vertical-align: middle; text-align: center"> 
     <div id="container" style="position: relative; right: 425px; width: 910px; margin: 0px auto;"> 
<!---Child Content--->  
     . 
     . 
    . 
     </div> 
    </body>

此修復爲IE7問題：

enter image description here

預見然而，當施加的格式是關閉的IE8，Firefox，鉻等上面的第二造型格式：

火狐（在Chrome和IE8相同的行爲）

enter image description here

希望這是一個簡單的修復，我不明白爲什麼IE7不同對待的造型。任何幫助表示讚賞。

UPDATE：

@丹哈迪，漂泊 - 如果我能同時接受你的答案我會的，謝謝你們它的工作。這是非常奇怪的行爲，我認爲現在我不必迎合特定的瀏覽器。

來源

2011-03-22 kingrichard2005

如果width屬性後把!ie7，它將被比IE 7其他瀏覽器忽略：

right: 425px !ie7;

對於這更好的說明，請參閱這太問題和接受的答案：

Bang IE7 - What does it mean?

我讓你來決定這是否過於「哈克」，但它在堆棧溢出的CSS使用。

來源

2011-03-22 22:22:39

我真的很喜歡速記符號，並嘗試使用它，當我可以。 – kingrichard2005 2011-03-22 23:15:22

這鋪平了道路，修復的方式，但不是嚴格意義上的解決辦法：

您可以添加條件瀏覽器特定語句到你的HTML代碼：

http://css-tricks.com/how-to-create-an-ie-only-stylesheet/

你可以做什麼基本上是添加評論的下面到您的頁面：

<!--[if IE 7]> 
    <link rel="stylesheet" type="text/css" href="conditional_ie_7_stylesheet.css" /> 
<![endif]-->

在這些標籤之間，你可以添加必要的樣式來抵消th特定瀏覽器上的問題。

正如我所說，這不能解決您的CSS問題，但它提供了一個替代方案。

來源

2011-03-22 22:21:10

感謝您的幫助和資源丹尼爾，我會保持這種方式和方便的鏈接。 – kingrichard2005 2011-03-22 22:36:13

在閱讀了Adrift提供的鏈接後，我發現這種特定的方法雖然解決了問題，但被認爲是非標準的破解。我想嘗試堅持標準，只是個人風格，所以我可能會改變你提供的格式。 – kingrichard2005 2011-03-22 23:19:09

我想我的解決方案和接受的解決方案之間的區別是 - 如果您需要更改大量樣式，則可以像上面那樣在特定樣式表中收集它們。如果你只是改變一兩件小事，那麼接受的解決方案也是一樣的！ – 2011-03-23 08:33:48

當您從div中刪除position: relative時，能夠在原始問題中使html正常工作在IE7中。也有機會在html/css內容中引發相互作用，導致潛在的問題，所以如果這不能解決問題，你可以發佈你的HTML/css內容，它可以在截圖中顯示問題很有幫助。

來源

2011-03-22 22:25:15 Adrian

感謝Aliester，代碼實際上是一個將應用於多個頁面的模板，其中一個要求是讓容器div相對定位。 – kingrichard2005 2011-03-22 22:40:09

IE8 vs IE7 html格式化

回答

相關問題