打印 CSS - Chrome 中的分页符

Question

我最近遇到了这个问题，即 chrome 行为怪异且不遵守任何 CSS 规则。

在我的页面中，我不想在打印时打断它们。 下面是代码

body.index .section{
    page-break-inside: avoid;
    -webkit-region-break-inside: avoid;
}

它适用于除 CHROME 之外的所有其他浏览器。 在 chrome 中，它看起来像

红色部分显示 div 中断。

PS：我对页面进行了模糊处理，避免出现任何问题。

Answer 1

尝试将position: relative 添加到该部分。

body.index .section{
    position:relative;
    page-break-inside: avoid;
    -webkit-region-break-inside: avoid;
}