相同的HTML在不同的主機上給出不同的佈局

這個代碼（它是來自實際頁面的工作片段）按照預期在Firefox & Firefox上運行，並且在IE7 & 8上的一個虛擬主機上運行，但是當它移動到另一個如果「固定」改爲「絕對」那麼它工作正常，但不是要求相同的HTML在不同的主機上給出不同的佈局

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>Test Page</title> 
    <style type="text/css"> 
     .alrtfrnt { background-color:gray;} 
     .alrtfrnt { position:fixed;top:33%;left:33%;height:150px;width:300px;z-index:9;} 
    </style> 
</head> 
<body> 
    <div class='alrtfrnt'></div> 
</body> 
</html>

：舉辦「固定」的位置在IE忽略。

它不可能是一個緩存問題，因爲這開始與'真正'的網頁，並繼續通過一些全新的網頁。我還更改了塊上的顏色以確保正在拾取並設置IE以檢查每個頁面訪問的更新。

我不知道爲什麼完全相同的代碼應以不同的方式顯示，這取決於服務器，所以任何線索我可以檢查或更改的下一件事將不勝感激。

來源

2011-05-01 blankabout

對於不同的服務器環境（您的主機），在HTML/CSS /腳本文本輸出方面完全相同的頁面顯示不同，這是無意義的。請提供一些鏈接來演示。 – 2011-05-01 19:43:42

一個解釋可能是緩存，因爲這是基於域名。確保在重新加載頁面之前清除緩存。 – Thilo 2011-05-01 19:45:33

爲什麼我會問這個問題，或者如果沒有發生這種情況，我已經將代碼降低到絕對最小值了？這可能是'無意義的'，但是我在不同的主機上有兩個相同的頁面，他們以不同的方式顯示。我無法提供鏈接，因爲測試頁面位於本地VM上。 – blankabout 2011-05-01 19:48:03

這有可能是一個服務器模塊與你的輸出搞亂並混淆IE。例如，mod_pagespeed可以用於優化目的，儘管我還沒有聽說過IE的問題。我將在IE正在讀取的源代碼上運行diff（不是保存的文件本身）。

如果他們證明是相同的，我會懷疑怪癖模式的問題（其他答案的處理方式比我更徹底）。

來源

2011-05-01 20:15:19 waiwai933

你可以嘗試把重要的位置放在結束符之前的固定位置旁邊嗎？

.alrtfrnt { position:fixed !important;top:33%;left:33%;height:150px;width:300px;z-index:9;}

來源

2011-05-01 20:00:02 robx

一個主機可能觸發兼容模式或quirks模式。我會檢查一些要點：

確保標記完全相同 - 即使頁面頂部的註釋可能會改變呈現。
兩臺主機的定義都是相似的 - 例如，它們都位於受信任的Intranet位置。
這是一個愚蠢的問題 - 但是這是否會在所有機器上發生？兼容模式可以手動觸發，並由瀏覽器保存（每域iirc，因此它可能已被該主機上的內部頁面觸發，而不是在另一主機上觸發）。
在互聯網上，一個主機可能位於Compatibility View List。你可能很幸運。
IIS -
- 確保已安裝所有更新。
- 有可能到configure IIS to trigger compatibility mode by sending custom headers：棘手。

來源

2011-05-01 20:12:23 Kobi

這真的是一個真正的評論，因爲它大部分都是猜測，但是增長很多...... – Kobi 2011-05-01 20:12:58

你肯定有正確的想法，''這是可能的，一個主機觸發兼容模式或怪癖模式。 – thirtydot 2011-05-01 20:15:27

讓我們把你的兩臺主機A和B：

主機A - 一切正常。

主機B - 它擰了，position: fixed不起作用。

問題幾乎可以肯定的是IE在Quirks Mode中顯示主機B.

您可以通過按F12並查看文檔模式進行驗證。

如果它說「IE8標準」，那麼事情的工作。
如果它說「怪癖模式」，那麼事情（如position: fixed）將無法正常工作。

這裏有一個指導確定究竟爲什麼Internet Explorer被恢復到Quirks模式：

http://hsivonen.iki.fi/doctype/#ie8modes

如果這似乎有點太複雜了，你可以（在幾乎所有案例）通過添加此元標記強制正確的文檔模式：

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

如果有幫助，我寫的是同一件事的一些其他答案：

來源

2011-05-01 20:13:11 thirtydot

這與quirks模式有關，由一個虛擬主機正在使用的模塊觸發，而不是另一個。感謝您的全面回答和鏈接。 – blankabout 2011-05-01 20:48:03

出於好奇，它是哪個模塊？ – thirtydot 2011-05-01 20:49:59

相同的HTML在不同的主機上給出不同的佈局

回答

相關問題