page-break-inside被忽略

Question

我正在从另一个页面动态添加HTML并将其设置为打印样式。但是，page-break-inside: avoid;，当应用于我的元素（其中任何一个）时，即使它出现在样式中，也不会在打印时考虑到它。我在Windows上使用Chrome 31

Here is a jsFiddle我的程序的简化版本（警告：它会在3秒后显示打印预览。要停止此操作，只需注释掉底部的setInterval ），这是page-break-inside:avoid在打印预览中没有任何效果的版本

我发现通常的“修复”，将position:relative添加到元素及其父元素中，在我的情况下不起作用。前缀（正如一对人建议的那样）似乎无法正常工作

我知道page-break-inside: avoid;可以在Chrome 31中使用动态放置的元素，因为我tested it out in a pseudo-version（警告：这也打开了打印预览版），但是花了几个小时删除代码后，玩弄风格，研究这个主题（大多数帖子都已经过时了）我似乎无法让我的更复杂的版本以同样的方式工作

提前感谢任何见解！

Answer 1

将#fromTumblr ID的显示属性从inline-block更改为block。

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

这是更新的小提琴，在Windows上的Chrome 31和FF26上进行了测试：http://jsfiddle.net/FSyT5/27/