爲什麼使用colspan時Internet Explorer 9/10會忽略列寬？

我想下面的代碼應該解釋這個問題。爲什麼使用colspan時Internet Explorer 9/10會忽略列寬？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>Test</title> 
<style type="text/css"> 
body { padding-bottom: 24px } 
table { table-layout: fixed } 
</style> 
</head> 
<body> 

<table class="question" id="TR09_tab" border="0" cellpadding="0" cellspacing="0" width="100%"> 
<colgroup> 
    <col width="22"> 
    <col width="110"> 
    <col> 
</colgroup> 
<tr> 
    <td><input name="one" id="one" value="yes" type="checkbox"></td> 
    <td colspan="2"><label for="one">Option 1</label></td> 
</tr> 
<tr> 
    <td><input name="two" id="two" value="yes" type="checkbox"></td> 
    <td colspan="2"><label for="two">Option 2</label></td> 
</tr> 
<tr style="display: none"> 
    <td colspan="2"><label for="text">Text:</label></td> 
    <td><input name="text" id="text" type="text" value="" style="width: 98%"></td> 
</tr> 
</table> 

</body> 
</html>

問題：第一個柱顯示比22px大得多。

注：我不能使用表的固定寬度，因爲表中有一個可變寬度佈局。

第三行設置爲display：none，因爲只要選擇其中一個選項，它就會顯示（通過JavaScript）。只要顯示這一行，所有的列寬都是完全正確的。

在其他上下文中使用colspan時，我已經遇到col-width-definitions和IE的問題 - 但是，這是第一次忽略非跨越單元的寬度。

爲什麼IE 9/10在這種情況下簡單地忽略了我的colgroup定義？
任何建議，以解決問題如果我不能改變表結構（即我需要這三個colums和colspans）？

非常感謝！

來源

2013-04-23 BurninLeo

http://stackoverflow.com/questions/13522196/ie9-0-and-colgroup-colspam-issue – 2013-04-23 18:59:13

即使我刪除最後一行，W3C驗證程序不會報告任何錯誤。此外，另一篇文章中的代碼不*定義任何列寬度。我可能只是盲目的，但我不明白這一點？！ – BurninLeo 2013-04-23 19:28:29

當最後一行有display: none時，IE似乎與表結構混淆了。如果刪除該設置，則寬度會改變。如果沒有該行，該表就會違反HTML表格模型（如驗證器報告，如果實際上從標記中刪除該行並告訴驗證程序執行HTML5驗證（檢測到表模型錯誤））。

如果你用visibility: collapse代替display: none，事情就會改變，雖然某些舊版本的IE不支持該設置。

首先，我認爲表格結構應該是正確的，當只有可見行被計數時。

來源

2013-04-23 19:58:36

再一次，我測試了代碼*沒有* http://validator.w3.org/#validate_by_input的最後一行，它給了我一個「有效」（儘管缺少字符編碼有兩個警告）。無論如何謝謝你的「知名度」提示 - 這立即解決了問題:) – BurninLeo 2013-04-23 20:12:11

對不起，我忘了說驗證器報告問題*，如果在HTML5模式*。 HTML表格模型要求不能用DTD表示，因此僅在HTML5驗證中報告。我會編輯我的答案。 – 2013-04-24 05:00:18

爲什麼使用colspan時Internet Explorer 9/10會忽略列寬？

回答

相關問題