Ipython: Centered equations become left aligned if displayed through the markdown display hook

Created on 25 May 2018  ·  3Comments  ·  Source: ipython/ipython

The following markdown works fine in a markdown cell, centering the equation:

The math is centered: $$x$$

But, when placed inside a markdown display method it becomes left aligned (any way you do it, or any number of blank lines, just using this one for brevity):

from IPython import display
display.display_markdown("The math is not centered: $$x$$", raw=True)

It starts out in the center, then leaps over to the left. I think this was a problem that got fixed for markdown cells, but not for the display output.

Edit: This appears in the output style:

div.output_area .MathJax_Display {
text-align: left !important;
}

It is overriding the explicit style in:

<div class="MathJax_Display" style="text-align: center;">...

Related to ipython/ipython#7827, but this is in a vanilla Jupyter notebook with IPython.

It seems to be coming from here:

https://github.com/jupyter/notebook/blob/de92a2b34fc50c090c1c02c3b57dbe882cd64d3c/notebook/static/notebook/less/outputarea.less#L52-L55

Most helpful comment

I'm experiencing this very issue in 2020. Seems this bug was just ignored?

All 3 comments

I guess the idea was that an equation by itself (i.e. displayed with the Math class) should be left aligned, like any other output would be. Possibly it doesn't make sense for block equations in markdown. Can you see a way of making the CSS selector more specific so it would differentiate between those cases?

This is markdown instead of latex, so that's one difference that could be used. output_markdown rendered_html is unique to this case, where as just output_latex is on the output of Math (ignoring attributes they both share).

But, really, even for Math, the output does an irritating jump from middle to left of the screen. I think the Math should be inline style ($x$ in markdown) vs. display style ($$x$$) if it is intended to be left aligned as an output, or it should be able to change the the MathJax HTML output <div class="MathJax_Display" style="text-align: center;"> which is causing the jump and forcing the !important rule.

I'm experiencing this very issue in 2020. Seems this bug was just ignored?

Was this page helpful?
0 / 5 - 0 ratings