html 表行跨度在 Safari 中无法正常工作

【问题标题】：html table rowspan not working correct in safarihtml 表行跨度在 Safari 中无法正常工作
【发布时间】：2023-03-26 17:05:01
【问题描述】：

这是预期的结果，并且在 chrome 中工作正常。

但它在 safari 中崩溃了

JS 小提琴： https://jsfiddle.net/evpb3zLa/

  <tbody>
    <tr>
      <td rowspan="6">6</td>
      <td rowspan="6">6</td>
      <td rowspan="2">2</td>
      <td rowspan="3">3</td>
    </tr>
    <tr></tr>
    <tr>
      <td rowspan="2">2</td>
    </tr>
    <tr>
      <td rowspan="3">3</td>
    </tr>
    <tr>
      <td rowspan="2">2</td>
    </tr>
    <tr></tr>
    <tr>
      <td rowspan="2">2</td>
      <td rowspan="2" colspan="3">2</td>
    </tr>
  </tbody>
</table>

【问题讨论】：

标签： html css safari

【解决方案1】：

在 safari 行跨度问题上没有找到任何解决方案，但最终使用了嵌套表。这就像一个魅力 xD。

table, td, th {
  border: 1px solid;
  border-collapse: collapse;
  padding: 5px;
}

<table>
  <tbody>
    <tr>
      <td rowspan="6">6</td>
      <td rowspan="6">6</td>
      <td rowspan="2">
        <table class="sub-table">
          <tbody>
            <tr>
              <td>fixed-1</td>
            </tr>
            <tr>
              <td>fixed-2</td>
            </tr>
            <tr>
              <td>fixed-3</td>
            </tr>
          </tbody>
        </table>
      </td>
    <tr></tr>
    <tr></tr>
    <tr>
      <td rowspan="3">3</td>
    </tr>
    <tr></tr>
    <tr></tr>
  </tbody>
</table>

【讨论】：