How to add a background image or color to exported PDF

Things I have tried

Adding a background to html, body, .print, .view-content won’t work

@media print {
    html, body, .print, .view-content {
        background-color: coral;
    }
}

Adding a background to .markdown-preview-view kinda works, but the background won’t span the entirety of the page (there’s a large white gap between the text and the bottom of the page, even if .markdown-preview-view is set to width and height of 100%).

@media print {
.markdown-preview-view {
    width: 100%;
    height: 100%;
    background-image: none;
    background-color: coral;
}
}

I even tried to set width and height to 100% to each ascendant I could find in the inspector, but still didn’t work.

@media print {
    html, body, .print, .view-content, .view-content>div, .workspace-leaf, .workspace-split, .workspace, .horizontal-main-container, .app-container {
        width: 100%;
        height: 100%;
    }
}

Other properties such as text color are working if I use html or body as the selector which leads me to conclude that the background is purposely being removed (maybe color saving mode or something)

The only way I could make this partially work is by exporting with no margins (awful) and adding a forced page break at the end of the document which is an awful hack for something that should be pretty simple. Also it creates an extra empty page.

What I’m trying to do

Add a background color or image that spans the entirety of the pdf document, while retaining margins.

2 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.