fast-reflexes/better-react-mathjax

How to get a new line?

nioclass opened this issue · 1 comments

I am trying to write some math in two separate lines using "//" as the new line. But this is not working and the elements are rendering on the same line. For example:

    <MathJaxContext>
        <MathJax>{" a // b "}</MathJax>
    </MathJaxContext>

This renders:
ab
instead of:
a
b

The same happens when I replace "//" with "////".

How do I get a new line?

Hi there!

Looks like that line break is only working with MathJax 2 and not in MathJax 3 (mathjax/MathJax#2312). So use version={2} in your MathJaxContext and it should work. I also suggest you use delimiters in your MathJax code since even if line breaks WOULD work, it wouldn't work if you didn't delimit your MathJax content with appropriate delimiters, much like how it is done in pure MathJax. Please check examples.

If you want to use MathJax 3, you can check the suggestions given in this thread: https://stackoverflow.com/questions/62583406/why-doesnt-display-a-newline-in-mathjax

You can also always enforce line breaks in the HTML instead:

<MathJaxContext>
    <MathJax>
        <span>{"\\(a\\)"}</span>
        <br />
        <span>{"\\(b\\)"}</span>
    </MathJax>
</MathJaxContext>