subscript becomes superscript in multiscript on WebKit

[xworld21]

Issue Summary

Multiscripts are rendered incorrectly in Safari/WebKit.

Steps to Reproduce:

<math display="block">
  <mmultiscripts>
    <mi>A</mi>
    <mi>postsub</mi>
    <mprescripts></mprescripts>
    <mi>presub</mi>
    <mi>presup</mi>
  </mmultiscripts>
</math>

On Safari (tested on macOS and iPadOS) you get

You can see that if there are both sub- and superscript, the rendering is fine. If there is only a subscript, it moves to the top (and actually even higher than a normal superscript).

Technical details:

• MathJax Version: 3.2.2
• Client OS: macOS 14.7.2
• Browser: Safari 18.2

I am using the following MathJax configuration: on https://www.mathjax.org/#demo

[xworld21]

We've come up with a workaround:

@media (-webkit-transform-2d) {
  mjx-mmultiscripts>*>mjx-row>mjx-cell>*:not(:has(*)) {
    height: 1px;
  }
}

which seems to imply that WebKit will ignore table-cells of zero height. So this might cause other rendering bugs where CSS tables are used.

[dpvc]

Thanks for the report. It does seem to be a Safari bug.

In version 4, MathJax inserts <none> elements rather than empty <mrow> elements, so it will be easer to target these. I will make a PR for v4 to resolve the issue,.