【问题标题】:Non-script workaround for Webkit's table cell's rowspan issueWebkit 表格单元格的行跨度问题的非脚本解决方法
【发布时间】:2012-10-06 19:49:15
【问题描述】:

对于与单元格rowspan 相关的 Chrome/webkit 问题是否存在任何已知的非脚本解决方法,该问题高于所有非跨行行的总和?因为 Chrome 不会平均分配同级行,而是调整最后一行以填充剩余空间。

在不同的浏览器中查看this example,您会看到如下图所示的结果。

列跨越按预期工作

请注意,列跨越按预期工作。所有列都被扩展以容纳最宽的跨度列。如果其他单元格的宽度相同,它们也会被均匀扩展,但如果它们没有设置宽度,它们会根据其内容相应地扩展(照常渲染)。

示例截图

外边框显示表格边框,内边框显示单元格边框。出于显示原因,我没有折叠边框,因此每个元素的边框都与其他元素分开。

在 Internet Explorer(令人惊讶)和 Firefox 中显示:

在 Chrome(或其他 webkit 浏览器)中显示:

额外观察大rowspan

在我的示例中,有 4 行,第一行中的最后一个单元格跨越所有四个行。如果我将该值更改为大于 4,webkit 实际上会呈现不存在的第五行而没有任何单元格。因此,与其扩展第四行以占用所有剩余空间,不如说是第五行不存在的情况。这是 Chrome 中的结果(bot 不在任何其他浏览器中):

【问题讨论】:

    标签: google-chrome webkit html-table


    【解决方案1】:

    阅读本文时的第一个想法就是这样做:

    <table class="details"><tr><td  >First col</td></tr>
                <tr><td >First col</td></tr>
        <tr><td >First col</td></tr>
        <tr><td >First col</td></tr>
        </table>
    <td>Kleke</td>
    

    然后通过 CSS 管理边框(如果需要帮助,请发表评论)

    菲利克斯干杯

    编辑:我刚刚意识到您要求的年份是 2012 年而不是 2013 年,如果您可以提供更好的例如请发布替代解决方案。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-03-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多