html table rowspan 在 safari 中无法正常工作

Question

这是预期的结果，在 chrome 中运行良好。

但是它在 safari 中坏了

JS Fiddle: 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>

Answer 1

没有找到任何关于 safari rowspan 问题的解决方案，但最终使用了嵌套表。这就像一个魅力 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>

html table rowspan 在 safari 中无法正常工作

html table rowspan not working correct in safari

html

css

safari