为什么使用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会忽略列宽？

回答

相关问题