I'm using wkhtml2pdf and it looks like the renderer won't apply CSS font overrides from local fonts anywhere. It seems no matter what, wkhtml2pdf is using the default font, unless the font is explicitly @import()ed.
For the most part I'm OK with just a single font for the document, but it's annoying for code snippets when it doesn't render in a proportional font. I have font overrides for <pre> (and <pre><code>) like this:
pre, pre > code {
font-family: monospace;
}
I've also tried explicit fonts like Consolas, Menlo etc. which also doesn't work.
Here's what this looks like in the PDF:
As you can see the code block does not reflect the font change and renders in the document font, not monospace (or whatever other built-in font I might specify). Rendering the same in modern Chromium browsers renders the alternate font correctly.
I can get this to work however by use @import() and explicitly importing a Web font:
@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,400;0,700;1,400;1,700&display=swap');
And then referencing that font in the CSS:
pre, pre > code {
font-family: "Source Code Pro", monospace;
}
While that works using Web fonts isn't an ideal scenario as it requires Web access.
Two questions:
Is there a way to get wkhtml2pdf to work with built-in fonts in CSS styles? If so how do these need to be imported
Why is
monospacewhich should be totally generic not working in this case?
