3

我找到了这个主题,我的主题是相关的,但不一样:

在 IE9 的 tds 上使用 cols 和 colspan 进行表格渲染

我遇到的问题是我的表中的第二个 colspan=2 没有被 IE9 读取,有趣的是它可以在 IE7 和 IE8 中找到,但不能在 IE9 中找到。也许我做错了什么,所以这里是:

HTML:

<table id="test">
    <tbody>
        <tr>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
        </tr>
    </tbody>
</table>

CSS:

#test {
    width: 100%;
    border-spacing: 20px;
    border-collapse: separate;
    table-layout: fixed;
}

#test td {
    position: relative;
    background-color: #cccccc;
    box-shadow: 3px 3px 2px rgba(0,0,0,0.5);
    padding: 10px;
}

jsFiddle:http: //jsfiddle.net/DUCPp/1/

应该发生什么: 在此处输入图像描述

IE9 给了我什么: 在此处输入图像描述

我确信这是一个 IE9 错误,但我无法在谷歌上找到它(也许我没有搜索正确的关键字?)。任何解决方案或错误报告的链接将不胜感激!

更新: 我在第二个 colspan=2 列之后添加了一个额外的列,它将正确呈现。我推断如果一行中的最后一列 colspan > 1,那么它只会被渲染为 colspan = 1。

关于修复的任何想法?我现在几乎可以肯定这是一个 IE9 错误 <_<

4

4 回答 4

2

呵呵……IE9……

找到了一个“修复”......想法来自:Colspan on cell in one row 似乎阻止在所有其他行中设置 TD 宽度。为什么?

基本上我必须添加一个空行,其中包含正确的空单元格数:

<table id="test">
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
        </tr>
    </tbody>
</table>

不漂亮...我需要删除单元格的填充以使其不显示。叹...

jsFiddle:http: //jsfiddle.net/DUCPp/5/

于 2013-03-12T19:28:45.207 回答
1

您要做的是在标题中通过 TH 设置列的宽度,因为浏览器将使用它来确定后续行中的表格和列的宽度。

看看下面的例子:

<table>
    <thead>
        <tr style="height: 0px;">
            <th style="width: 110px; height:0px;"></th>
            <th style="width: 160px; height: 0px;"></th>
            <th style="width: 210px; height: 0px;"></th>
            <th style="width: 110px; height: 0px;"></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td colspan="3">Hello</td>
            <td>There</td>
        </tr>   
    </tbody>  
</table>
于 2013-05-03T19:27:09.027 回答
0

您似乎没有为列定义任何固定宽度。你应该在之前使用这样的东西<tbody>

<col span="6" style="width:16%;" />
于 2013-03-12T19:24:15.620 回答
0

我通过在 HTML 代码的开头添加 doctype 声明解决了类似的问题。请参阅http://www.w3.org/QA/2002/04/valid-dtd-list.html 我添加的具体声明是针对版本“HTML 4.01 Transitional”。即放置在初始标签之前。

希望这可以帮助?

于 2015-04-03T10:11:21.643 回答