Operating system
Windows
Joplin version
3.1.24
Editor
Markdown Editor
What issue do you have?
Hello,
I am encountering an issue with the PDF export functionality in Joplin. Specifically, when I use the following custom CSS for adding a header and footer, the body content overlaps with both the header and the footer. This occurs particularly on pages after the first one in multi-page PDFs.
Here is the custom CSS I am using:
@media print {
@page {
/* Top/bottom vs. left/right margins. */
margin: 40pt 40pt;
}
.exported-note::before {
position: fixed;
top: 0;
display: flex;
align-items: center;
width: calc(100% - 20pt);
height: 10pt;
font-family: 'Roboto Mono';
font-size: 10px;
color: darkgrey;
justify-content: flex-end;
content: 'I am header';
}
.exported-note::after {
position: fixed;
bottom: 0;
display: block;
width: 100%;
font-family: 'Segoe Print', sans-serif;
font-size: 6pt;
color: #333;
text-align: left;
border-top: 1pt dashed darkgrey;
padding-top: 5pt;
white-space: pre-wrap;
line-height: 1.1;
content: "I am footer";
}
}
The header and footer render correctly, but the main content of the document sometimes overlaps with these fixed elements. I have attached a sample PDF illustrating the problem.
Screenshots
5. Joplin Privacy Policy.pdf (225 KB)
userstyle.css (751 Bytes)