Ask Your Question

Revision history [back]

click to hide/show revision 1
initial version

Using Google Chrome, you can look at the document source for the window you get via the 'print' button, and it seems to use the same stylesheets as the editable worksheet. It's not clear to me in either case where the user-provided notebook.css gets included. Both interactive and print versions respect style commands embedded directly in the notebook with a %html directive, for example to make my aligned equations (output with 3-column html.table() calls), I include a cell with:

%html 
<style>
table.table_form * tr.row-a { background: #ffffff; }
table.table_form * tr.row-b { background: #ffffff; }
table.table_form * td { padding-top: 5px; padding-bottom: 5px; padding-left: 2px; padding-right: 2px; }
table.table_form tr td:first-child { text-align: right; }
</style>

One thing I have noticed though, is that many of the elements are displayed with different CSS classes in the printed version. For example an input cell is class .cell_input in the editable worksheet, but .cell_input_print in the printed one.

This is actually handy - as noted above I've been using the worksheet to write a technical note with various graphs and equations in it, so using lots of %html sections with embedded <sage> tags. I don't want to have to cut & paste stuff to another document, I just wanted to use all my output cells as the document itself, so was using a trick I saw somewhere else to hide input cells using a style like this:

textarea.cell_input {display : none}

which makes all your input cells disappear. But it's a bit painful to have to keep editing the source for the worksheet to make them display: inline again whenever I want to change something (not to mention it didn't effect the print view!). So now I'm instead just using the print view as the final document by using this style:

.cell_input_print {display : none}

I also get it to center images (like plots) in the print view by adding:

.cell_output_box {width : 100%}
.cell_output_print_wrap * img { display: block; margin-left: auto; margin-right: auto }

I can print to PDF and I'm all set - the quality is actually pretty impressive!