I have a python script generating a couple of hundred HTML files as reports. I then use PDFKit to convert those HTML files to PDF.
The styling is done by a downloaded copy of Bootstrap 5 because of network issues preventing me using the Bootstrap CDN.
The problem I have is that the HTML and the rendered PDF are not exactly the same. The font family and the background color of a cell are not rendered. Everything else is fine.
According to https://getbootstrap.com/docs/5.0/content/reboot/#native-font-stack the native font on Windows is Segoe UI. This font is available and installed on my workstation.
In order to get the HTML and generated PDF to be exactly the same, I need to do this:
<!DOCTYPE html><html lang="en"><HEAD><meta charset="utf-8" />
<link href="file:///C:/temp/bootstrap-5.0.2-dist/css/bootstrap.min.css" rel="stylesheet">
<style>
.specialcolour {
background-color: #071731;
color: white;
}
* {
font-family: 'Segoe UI', 'Arial', sans-serif;
}
</style><title>....
But all I'm doing is re-iterating what should be the native font by Bootstrap. I've experimented with a bunch of different font families and the result is the same.
So long as I specify the font family, the HTML and the PDF will look the same.
Any ideas about what is going on here?