IE6網站顯示問題（背景或填充問題？）

我試圖讓一個網站在IE6和IE7中正常顯示。這裏是它在IE6中的外觀截圖。IE6網站顯示問題（背景或填充問題？）

alt text http://img225.imageshack.us/img225/4779/screenshot20091006at239.png

IE8，Safari瀏覽器，Firefox等所有顯示這個網站正常。有人能給我一個暗示，是什麼導致了IE6的失真？

如果你想看看網頁的源文件，該網站是：www.devaswami.com

從here獲取CSS。

2009-10-06 Candidasa

您正在爲導航欄使用自動佈局表格，並且它有colspans。這會讓IE感到困惑，因爲在有colspans的時候，這並不是很好的解決多大表需要的表格。它使得桌子比你需要的寬，這使得你的細胞比預期的更寬，這使得醜陋的黃色背景顯示出來，並且它不排隊。

爲了解決這個問題，設置表格元素上的樣式table-layout: fixed; width: 970px;，並添加一個<col>元素爲每一列，每一個width: ...px風格，告訴IE究竟有多大，使每一列。然後它不會犯任何錯誤（並且更大的固定表格佈局渲染速度更快）。

爲了更好地解決問題，請刪除佈局表格併爲導航鏈接使用定位的div。然後，您也可以丟失無聊的圖像切片，併爲整個標題背景使用單個GIF，並將照片和鏈接放置在頂部。你也可以在你的樣式表中使用//作爲單行註釋，但是在CSS中沒有這種東西;你只會混淆解析器進入丟棄規則。）

來源

2009-10-06 04:47:43 bobince

嗯，一目瞭然，你有東西是左邊的浮動，你有一個餘量留在它呢？

#foo { 
    float: left; 
    margin-left: 20px; //20px in all browsers except IE6 where it will be 40px; 
    display: inline; //this will fix this issue 
}

來源

2009-10-06 02:00:34 Colin

不在頁面上浮動。 – Candidasa 2009-10-06 03:47:33

有很多的可能性，很難根據屏幕截圖進行猜測。然而，朝着使IE 6和7的行爲更好的一個大的步驟是在文檔的頂部聲明文檔類型：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

這對HTML 4.01，你必須更新它來搭配你在做什麼特別是使用如果它不是HTML（即XHTML）。僅僅這些有助於解決一些基本問題，但不是全部。如果這樣做不行，谷歌「IE6 CSS黑客攻擊」，你會發現很多可能適用於你的上下文的潛在信息。

來源

2009-10-06 02:01:48

編輯：我建議你修復與缺少/不正確的結束標記錯誤：

錯誤行199列194：爲元素結束標記「一個」未打開

錯誤線200，柱49：結束標記爲元件「p」，這是不開放

來源：http://validator.w3.org/check?uri=http%3A%2F%2Fdevaswami.com%2F&charset=(detect+automatically)&doctype=Inline&group=0

完成之後，我們可以推斷出它不是標記相關的問題。

原來的答覆：

嘗試任何浮動元素上應用hasLayout的每一個元素，並使用display:inline：

#nav li { display:inline; } /* the selector *must* be floated and have horizontal margins in the direction of the float. */ 

* { zoom:1; }

對於任何固定的縮放：1，適用於寬度/高度和會觸發hasLayout。

雖然它可能會有用，如果你實際上發佈了一些源代碼。

來源

2009-10-06 02:02:57

IE6網站顯示問題（背景或填充問題？）

回答

相關問題