Reputation: 196
I am working with pdf-reactor and cannot make the header and footer to be in every page. I can, if I have only those two elements, header and footer, they are showing, but soon as I enter a single letter, footer disappears.
<div class="header">
<table class="header header-footer">
<tr>
<td class="invoicetext">header</td>
</tr>
</table>
</div>
<div class="footer">
<table class="footer header-footer">
<tr>
<td class="pagecounter">footer1</td>
</tr>
</table>
</div>
And this is the css:
@page {
margin: 2cm 2.5cm 3cm 2.5cm;
@top-left {
content: element(headerIdentifier);
vertical-align: bottom;
}
@bottom-left {
content: element(footerIdentifier);
vertical-align: top;
width: 100%;
}
@bottom-right {
content: element(companyIdentifier);
vertical-align: top;
margin-top: 4mm;
width: 100%;
}
}
div.spacing {
margin-top: 1.2em;
}
div.footer, div.header {
font: 9pt arial, sans-serif;
width: 100%;
}
div.footer {
position: running(footerIdentifier);
}
div.header {
position: running(headerIdentifier);
}
No matter where I add another div, on the top, bottom, between the header and footer, footer just disappears. How to prevent this from happening.
Upvotes: 0
Views: 627
Reputation: 301
We can reproduce this behavior here (issue #7827 in our internal tracking system). It seems to only occur when the running elements contain tables and when they are followed by only inline elements or text.
As a workaround, you could wrap the content after the running elements in a block element like this:
<div class="header">
...
</div>
<div class="footer">
...
</div>
<p>Some Text</p>
Upvotes: 0