Different font settings for editing code and markdown cells in the Jupyter Notebook

Question

In the Jupyter notebook, I would like to use the regular Ubuntu font when editing markdown cells and UbuntuMono for code cells. I can change the fonts of both these cell types simultaneously by editing .jupyter/custom/custom.css like so:

.CodeMirror pre {
    font-family: "Ubuntu Mono", monospace;
    font-size: 14pt;
}

I can also change the formatting of the headers in the markdown code cells:

.cm-header {
    font-size: 110%;
    font-family: "Ubuntu";
}

As well as how the text looks when rendered (after executing a markdown cell):

div.text_cell_render {
    font-family: "Ubuntu";
    font-size: 12pt;
}

However, I don't understand which css classes I could use to discriminate between code cells and paragragh/body text in markdown cells in edit mode. I tried the object inspector in Firefox, but the input text for both cell types show up with the same span tags and css classes. I have tried many of the combinations listed here , but it seems like I just can't find the right one, any ideas?

Answer 1

I received a reply from the Jupyter Notebook issue linked in the comments of my questions here. It is possible to combine CSS selector, so the following solves my problem:

.text_cell .CodeMirror pre {
    font-family: "Ubuntu";
    font-size: 12pt;
}