内部分页符被忽略

Zac*_*ier 2 css printing google-chrome dynamically-generated page-break-inside

我正在从另一个页面动态添加 HTML 并为其设置样式以进行打印。但是,page-break-inside: avoid;当应用于我的元素(其中任何一个)时,即使它出现在样式中,打印时似乎也没有考虑在内。我在 Windows 上使用 Chrome 31

这是我程序的简化版本的jsFiddle警告:它会在 3 秒后显示打印预览。要停止此操作,只需setInterval将底部的注释掉即可),这是对page-break-inside:avoid打印预览没有任何影响的版本

我发现的通常的“修复”,添加position:relative到元素及其父元素,在我的情况下不起作用。给它加上前缀(正如几个人所建议的)似乎也不起作用

我知道page-break-inside: avoid;在 Chrome 31 中使用动态放置的元素可以工作,因为我在伪版本中对其进行了测试警告:这也会打开打印预览),但是在花了数小时删除代码、尝试样式并研究该主题之后(大多数帖子都非常过时)我似乎无法让更复杂的版本以相同的方式工作

提前感谢您的任何见解!

Teo*_*vic 5

将 #fromTumblr ID 上的显示属性从 更改inline-blockblock

分页规则不适用于内联元素似乎合乎逻辑,并且由于该 ID 用于超过页面大小的包装器元素,我想这就是忽略所有其他规则的原因。

这是更新的小提琴,在 Windows 上的 Chrome 31 和 FF26 上测试过:http : //jsfiddle.net/FSyT5/27/