openhtmltopdf
openhtmltopdf copied to clipboard
Published
20 hours ago •
danfickle
danfickle
Display element with named page on same page as content before
I would like to display a custom header if the element with class .box is on the current page. When I set the page CSS-attribute to .box, then it will be always placed on a new page, but I want it on the old page, if enough space is available. I didn't set page-break-before: always;. Is this a bug or should I go another way?
<html>
<head>
<style>
@page defined-page {
@top-center {
content: 'This page was defined';
}
}
/*the box should display on the same page as the content before, if enough space is available*/
.box {
page-break-inside: avoid;
page: defined-page;
width: 100mm;
height: 100mm;
background-color: red;
}
</style>
</head>
<body>
<table>
<tr><th>Content before</th></tr>
<tr><td>Content before</td></tr>
<tr><td>Content before</td></tr>
<tr><td>Content before</td></tr>
</table>
<div class="box">test</div>
</body>
</html>
Reproducable on online sandbox
