Question

请告知我是否产生幻觉......我希望如此，因为根据浏览器我无法正确呈现表格，我希望有人能为我提供解决方案。

我的问题是某些表格没有显示使用webkit的浏览器的右侧边框，即Safari和Chrome。根据帮助下的about菜单项，我使用的Safari版本是4.0.4（531.21.10）。根据谷歌的网站，我使用的Chrome版本可能是最近的版本，但我无法在帮助下找到“关于”菜单选项来确认版本......

有问题的表是那些使用colspan属性的表，具体取决于列数。如果表具有两个或更少的colspan列，则表格将正确显示右边框。如果表有3个或更多列colspan，则表格显示缺少右侧边框。如果表没有colspan，则无论列数如何，表都会正确显示。为什么列数加上colspan属性与中国鸡蛋的价格有关？

顺便说一句：在IE，FF和Opera中正确呈现的表格......问题仅出在Safari和Chrome上......

以下是正确显示的两列示例的HTML源代码：

<HTML>
<HEAD><TITLE>test Webkit with 2 columns</TITLE></HEAD>
<BODY>
    <TABLE id="GridView1" border="0" cellSpacing="0"
        style="BORDER: #714938 2px solid; BORDER-COLLAPSE: collapse;">
        <TBODY><TR><TD colSpan=2>no items found</TD></TR></TBODY>
    </TABLE>
    <TABLE id="GridView2" border="0" cellSpacing="0"
        style="BORDER: #714938 2px solid; BORDER-COLLAPSE: collapse;">
        <TBODY>
            <TR>
                <TH scope=col>id_pur</TH>
                <TH scope=col>subscription_pur</TH>
            </TR>
            <TR><TD>11</TD><TD>2</TD></TR>
        </TBODY>
    </TABLE>
</BODY>
</HTML>

上面的示例呈现两个表，两个表都显示右侧边框。

以下是三列示例的HTML源代码，其中一个表呈现错误：

<HTML>
<HEAD><TITLE>test Webkit with 3 columns</TITLE></HEAD>
<BODY>
    <TABLE id="GridView1" border="0" cellSpacing="0"
        style="BORDER: #714938 2px solid; BORDER-COLLAPSE: collapse;">
        <TBODY><TR><TD colSpan=3>no items found</TD></TR></TBODY>
    </TABLE>
    <TABLE id="GridView2" border="0" cellSpacing="0"
        style="BORDER: #714938 2px solid; BORDER-COLLAPSE: collapse;">
        <TBODY>
            <TR>
                <TH scope=col>id_pur</TH>
                <TH scope=col>subscription_pur</TH>
                <TH scope=col>purchaser_pur</TH>
            </TR>
            <TR><TD>11</TD><TD>2</TD><TD>85</TD></TR>
        </TBODY>
    </TABLE>
</BODY>
</HTML>

对于上面的示例，第一个具有colspan的表在使用webkit broswers显示时缺少右边框，但没有colspan的第二个表没有丢失边框。

如果有两列以上且指定了colspan属性，如何才能显示正确的列？

Answer 1

据我所知，这是WebKit中的一个错误。

有一个bug report似乎与您的问题相似，也许您也可以在那里包含您的示例。该错误报告提出了一种解决方法：添加额外的列以使必要的colspan，或删除不需要的colspan。

这在Safari中正确呈现：

<HTML>
<HEAD><TITLE>test Webkit with 3 columns</TITLE></HEAD>
    <STYLE>
        tr.dummy-row>td { padding: 0; }
    </STYLE>
<BODY>
    <TABLE id="GridView1" border="0" cellSpacing="0"
        style="BORDER: #714938 2px solid; BORDER-COLLAPSE: collapse;">
        <TBODY><TR><TD colSpan=3>no items found</TD></TR></TBODY>
        <TBODY><TR class="dummy-row"><TD></TD><TD></TD><TD></TD></TR></TBODY>
    </TABLE>
</BODY>
</HTML>

Webkit浏览器渲染表取决于colspan

1 个答案: