Displaying maths inside html (jsx) tags

[Izhaki]

Using MDX with NextJS and following https://mdxjs.com/guides/math-blocks.

Inline and block maths is alright in markdown parts of the mdx document.

However, I need a better control over tables so I'm simply using jsx to generate them:

<table>
  <thead>
    <tr>
      <th />
      <th>X</th>
      <th>$Y_c$</th>
    </tr>
  </thead>
</table>

Problem is, $Y_c$ is just shown as is and is not converted to maths.

Oddly, another case of having some markdown inside jsx tags works:

<div style={{display: 'flex'}}>

| Tables        |      Are      |   Cool |
| ------------- | :-----------: | -----: |
| $L_c$         | right-aligned | \$1600 |

</div>

[wooorm]

Say you replaced the dollars for math in your examples with * for emphasis. Would you expect a different outcome?

[Izhaki]

No.

I do wonder if it is possible though (without installing additional components)

[wooorm]

Hmm. Well, once you’re in JSX, you’re currently in JSX, not in Markdown. You may have luck on the next branch though: the next version of MSX should support this!