Preserving DataFrame CSS in HTML export

[rgerkin]

If I create a notebook with content like this

the nice Jupyter front-end CSS formatting of the pandas dataframe goes away when I HTML export:

I can't remember if it was always like this (CSS goes away) or if this is a bug. I tried things like:
jupyter nbconvert my_notebook.ipynb --to html --CSSHTMLHeaderPreprocessor.enabled=True
but that just produced the same ugly HTML without good .dataframe class styling.
Is there a way to preserve the dataframe CSS as it looks in Jupyter itself when I export to HTML?
FYI this is Jupyter Notebook server 5.2.1, nbconvert version 5.3.1, and I get the same problem in Azure Notebooks (e.g. see how ugly this looks compared to how it would look in a Jupyter session).

[takluyver]

I think that's because nbconvert is using an older version of the CSS. Make sure that your nbconvert is up to date. If it is, and you're still seeing the error, it should be fixed by the next version of nbconvert (this PR updates the CSS it bundles: jupyter/nbconvert#696 ).

[rgerkin]

@takluyver I can confirm that if I download the current https://cdn.jupyter.org/notebook/5.1.0/style/style.min.css, call it custom.css, and place it next to my html file, then I get the good CSS rendering back when I view that html. My nbconvert is 5.3.1, but this commit which updated the CSS version to 5.1.0 didn't make into nbconvert 5.3.1, which was uploaded to pip just a few weeks earlier. Are you confident enough in the CSS to push a 5.3.1.1 with only that CSS change (i.e. 5.1.0 instead of 4.3.0)? Either way, I'll keep an eye out for a new nbconvert on pip, and also ask the Azure Notebook developers to upgrade when it is available.

[takluyver]

@mpacer is planning to release nbconvert 5.4 very soon.

[valentas-kurauskas]

A quick workaround that worked for me was to add

<link rel="stylesheet" href="https://cdn.jupyter.org/notebook/5.1.0/style/style.min.css">

in a Raw NBConvert type cell. (I also used a hide code plugin to hide the code.)