1

I want to generate a pdf from a custom-formatted jupyter notebook. I have managed to do that with in two steps:

  1. jupyter nbconvert --to html mynotebook.ipynb
  2. Using chrome to-pdf-print chrome --headless --to-pdf-print=mynotebook.pdf mynotebook.html

I prefer to stick to the HTML/CSS stack - rather than LaTeX - as this gives the best results for graphs.

Now, the one thing that I can't get to work is to add page breaks using CSS page-break-before. This issue in the nbconvert project mentions that this switch is overriden somewhere in the CSS hierarchy, but a I can't figure out where.

What I would like is to use custom.css that contains something like this:

@media print {
h1, h2 {
    page-break-before: always;
    }
}

Testing with a simple html document like this:

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="custom.css">
</head>
<body>
    <h1>Hello World (heading 1)</h1>
    <p>This is a web page.</p>
    <h1>Another heading 1</h1>
    <p>Some random text.</p>
</body>
</html>

gives me exactly what I want: a page break when printing with chrome.

But using custom.css with the static html output from nbconvert doesn't give page breaks. I have tried commenting out all instances of page-break-inside: avoid in the html, but still no luck.

I assume this must be fix-able within CSS, but I don't know how. Suggestions, anyone? Willing to pay for a solution, since I need it for a client. Note this is similar to this SO question, but thought it's best to start a new thread.

Environment: - OSX 10.14.5 - Python 3.7 - IPython 7.2.0 - nbconvert 5.4.1 - Chrome 76

dkapitan
  • 859
  • 2
  • 10
  • 21
  • Looking at how CSS works, it may be I need to alter the properties of the jupyter notebook CSS class, rather than `h1`, see https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance – dkapitan Sep 07 '19 at 15:43

0 Answers0