CSS分页控制，如何避免表格行寡妇（下一页单行）

Question

我有一个打印不同长度的潜在长动态表。这些表格可能跨越多个页面。有时，一行会打印到下一页。出于美学原因，我想避免这种情况。

所以这是我想要的：

明确地说，我不问如何避免表格单元格或表格行内的分页符。这会很容易。

我（有点）熟悉 page-break-after、page-break-before、page-break-inside。我仍然没有完成。

这里有一些小提琴手来演示：https : //jsfiddle.net/jobe451/Lxb37ejr/10/

该提琴手打印的原始结果：http : //fiddle.jshell.net/jobe451/Lxb37ejr/10/show/

到目前为止，我最好的失败尝试是这个 HTML：

      <tr class="row">
          <td class="colLeft">left</td><td class="colRight">right</td>
      </tr>
      <tr class="row afterAvoid">
          <td class="colLeft">left</td><td class="colRight">right</td>
      </tr>
      <tr class="row afterAvoid beforeAvoid">
          <td class="colLeft">left</td><td class="colRight">right</td>
      </tr>
      <tr class="row afterAvoid beforeAvoid">
          <td class="colLeft afterAvoid">left</td><td class="colRight afterAvoid">right</td>
      </tr>
      <tr class="row beforeAvoid">
          <td class="colLeft beforeAvoid">left</td><td class="colRight beforeAvoid">right</td>
      </tr>
  </table>
</body>

使用这个 CSS：

body {
    widows: 3;
    orphans: 3;
}
.afterAvoid {
    page-break-after: avoid;
}
.beforeAvoid {
    page-break-before: avoid;
}