page-break在IE上打印不分页问题

在打印的时候我们经常使用CSS

page-break-after: always;

来分页，如下。最近在做打印分页的时候发现IE11和其他主流的浏览器有一点细微的差别。

.page-break {
    page-break-after: always;
}
           

IE打印时，在浮动的元素上添加分页的样式，打印结果将不会分页

具体HTML代码如下：

<div style="float: left;"> 
    <p class="page-break">这个是第一页的内容</p>
    <p>这个是第二页的内容</p>
</div>
           

在谷歌浏览器上是正常分页显示的，在IE11中并没有分页，显示如下:

由于这种不一致的特性，我们要尽量避免

page-break

和浮动混用在一起。特别需要注意的是，有的库中的一些样式是带有浮动的，也应该避免，比如

bootstrap

中的

col-lg-12

等样式。