html - 打印分页符问题 - 在浏览器中打印预览

标签 html css google-chrome printing page-break

我遇到了分页符问题,我的 div 在应用分页符后从页尾开始,而不是在下一页。

我已经提到了这个问题 How to deal with page breaks when printing a large HTML table并对我的 CSS 属性做了一些调整

.items-list {
    page-break-inside:avoid;
    page-break-after:auto;
}

HTML文件的基本结构

<div class="row items-list" *ngFor="let country of countryWiseData">
    <div class="col-3"></div>
    <div class="col-3"></div>
    <div class="col-3"></div>
    <div class="col-3"></div>
</div>

我的问题是 Div 部分的延续,我需要损坏的 div 成为下一页的一部分。

enter image description here

最佳答案

这可能不是人们经常遇到的问题,但发布我的根本原因可能会对某人有所帮助。

问题是由于 css 属性是从隐藏在打印之外的元素加载的,在我的例子中是

flex-direction : column

关于html - 打印分页符问题 - 在浏览器中打印预览,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53398337/

相关文章:

html - 使用 CSS 设置文本区域的 "required"属性样式不起作用

javascript - PaymentRequest API 未定义

jquery - 当 AJAX 请求收到 "302 Moved"响应时会发生什么?

javascript - 使用js修改外部css值

css - 无法访问 html 时使用 css 隐藏单选字段

html - 在 GIMP 中自动将对象裁剪为最小尺寸/分辨率

javascript - 将文件放入区域 - 样式

javascript - 如何访问 Chrome 的拼写检查词典?

html - 如何在网页中制作全屏背景

javascript - 单击按钮监听器后如何调用预加载?