打印时在分页符处剪切文本
尝试在 Chrome 中打印时，我在 div 中的文本在分页符时被剪切。我已经尝试了各种 page-break-xxx，以及orphans: 5; widows: 5; page-break-after: avoid; page-break-before: avoid;. 我还尝试将 div 设置为表、块、内联、内联块......但没有任何效果。我花了很多时间在谷歌上搜索......我相信这必须在某个地方得到回答......有人能指出我如何或在哪里找到解决方案的方向吗？提前致谢！
<div role="tabpanel" class="tab-pane" id="tab_1">
{{ product.metafields.a }}
</div>
<div role="tabpanel" class="tab-pane" id="tab_2">
{{ product.metafields.b }}
</div>
<div role="tabpanel" class="tab-pane" id="tab_3">
{{ product.metafields.c }}
</div>
代码如上所示。它们实际上是标签，我强迫它们全部显示在印刷品上。我试过各种page-break-xxx上.tab-pane。
{{ product.metafields.x }} 基本上是像 H2、P 标签这样的文本。