^F search "whole word" mode broken
Steps to Reproduce:
- Go to https://www.mathjax.org/#demo
- Paste in
$\Sigma t = 423378$ - ^F, write "4", enable "whole words" mode with Alt+W
Behold:
Technical details:
- MathJax Version: 3.2.2/whatever the demo is
- Client OS: Windows 10, Bookworm
- Browser: Nightly 139.0a1 (2025-04-02) (64-bit)/ESR 128.6.0esr (64-bit)/DevEd 87.0b9 (64-bit)
I am using the following MathJax configuration:
MathJax = {
tex: {
inlineMath: [['[[', ']]']],
displayMath: [['[![', ']!]']]
},
// https://github.com/mathjax/MathJax/issues/3345#issuecomment-2731197248
startup: {
ready() {
const {mathjax} = MathJax._.mathjax;
const {STATE} = MathJax._.core.MathItem;
const {Menu} = MathJax._.ui.menu.Menu;
Menu.prototype.rerender = function rerender(start = STATE.TYPESET) {
this.rerenderStart = Math.min(start, this.rerenderStart);
const startup = MathJax.startup;
if(!Menu.loading)
startup.promise = startup.promise.then(
() => mathjax.handleRetriesFor(
() => {
if (this.rerenderStart <= STATE.COMPILED)
this.document.reset({inputJax: []});
this.document.rerender(this.rerenderStart);
this.rerenderStart = STATE.LAST;
}
)
);
};
MathJax.startup.defaultReady();
}
}
}
and loading MathJax via
<script id="MathJax-script" defer src="//cdn.jsdelivr.net/npm/[email protected]/es5/tex-chtml.js"></script>
This is a MathJax bug, since this doesn't happen with either raw MathML input or with extracting the rendered blob from the page:
<!doctype html>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mi mathvariant="normal">Σ</mi>
<mi>t</mi>
<mo>=</mo>
<mn>423378</mn>
</math>
<figcaption><mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="103"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D442 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi>O</mi><mo stretchy="false">(</mo></math></mjx-assistive-mml></mjx-container><mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="104"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45F TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="4"><mjx-c class="mjx-c30"></mjx-c><mjx-c class="mjx-c2E"></mjx-c><mjx-c class="mjx-c30"></mjx-c><mjx-c class="mjx-c32"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi>r</mi><mo>=</mo><mn>0.02</mn><mo>,</mo></math></mjx-assistive-mml></mjx-container> <mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="105"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45D TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D44E TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D459 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D452 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D452 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi>p</mi><mi>a</mi><mi>l</mi><mi>e</mi><mi>t</mi><mi>t</mi><mi>e</mi><mo stretchy="false">)</mo></math></mjx-assistive-mml></mjx-container><br> <mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="106"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-n"><mjx-c class="mjx-c3A3"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="4"><mjx-c class="mjx-c34"></mjx-c><mjx-c class="mjx-c34"></mjx-c><mjx-c class="mjx-c30"></mjx-c><mjx-c class="mjx-c31"></mjx-c><mjx-c class="mjx-c33"></mjx-c><mjx-c class="mjx-c33"></mjx-c></mjx-mn></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi mathvariant="normal">Σ</mi><mi>t</mi><mo>=</mo><mn>440133</mn></math></mjx-assistive-mml></mjx-container></figcaption>
The various characters used in MathJax's typeset output are placed into individual HTML tags with CSS that controls their style, size, and position on the page. In order to do that, the CSS sets those HTML tags as having display: inline-block, and I suspect that that means that adjacent characters don't actually form a "word" in the sense that the browser defines it.
Again, your extracted version doesn't include the CSS, so the display: inline-block and other CSS is not being applied, and the browser can consider the adjacent characters to be part of the same word. Your example doesn't have any positioning (like superscripts or fractions, etc), so you aren't noticing the lack of the CSS that would have controlled that when you extract the HTML without including the CSS. If you look carefully, however, you will see that the font is not the same in the true MathJax output and your extracted version (look at the 3s for instance to see that they are not the same).
MathJax's layout would not be possible without CSS like this, so this is not something that is likely to change.
okay here's a more complicated one:
\begin{align}
M_t &= (x \mapsto [|\overrightarrow{xq_t}| \leq r]) \circ D\\
&\Leftrightarrow\\
M_t &= (x \mapsto [|\overrightarrow{xq_t}| \leq r]) \circ \left(\bigcup_{x_g \in \mathbb{Z}^{342} \wedge g_{tm} \leq x_g \leq g_{tM}} h(x_g)\right)\\
\text{where}&\\
R &= \lceil G \frac{r}{B_r} \rceil\\
g_t &= \operatorname{trunc}(g(q_t))\\
g_{tm} &= \max(g_t - R, (0, 0, 0))\\
g_{tM} &= \min(g_t + R, (G-1, G-1, G-1))\\
\end{align}
<!doctype html>
<meta name="color-scheme" content="dark light">
<math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
<mtable displaystyle="true" columnalign="right left" columnspacing="0em" rowspacing="3pt">
<mtr>
<mtd>
<msub>
<mi>M</mi>
<mi>t</mi>
</msub>
</mtd>
<mtd>
<mi></mi>
<mo>=</mo>
<mo stretchy="false">(</mo>
<mi>x</mi>
<mo stretchy="false">↦</mo>
<mo stretchy="false">[</mo>
<mrow data-mjx-texclass="ORD">
<mo stretchy="false">|</mo>
</mrow>
<mover>
<mrow>
<mi>x</mi>
<msub>
<mi>q</mi>
<mi>t</mi>
</msub>
</mrow>
<mo>→</mo>
</mover>
<mrow data-mjx-texclass="ORD">
<mo stretchy="false">|</mo>
</mrow>
<mo>≤</mo>
<mi>r</mi>
<mo stretchy="false">]</mo>
<mo stretchy="false">)</mo>
<mo>∘</mo>
<mi>D</mi>
</mtd>
</mtr>
<mtr>
<mtd></mtd>
<mtd>
<mi></mi>
<mo stretchy="false">⇔</mo>
</mtd>
</mtr>
<mtr>
<mtd>
<msub>
<mi>M</mi>
<mi>t</mi>
</msub>
</mtd>
<mtd>
<mi></mi>
<mo>=</mo>
<mo stretchy="false">(</mo>
<mi>x</mi>
<mo stretchy="false">↦</mo>
<mo stretchy="false">[</mo>
<mrow data-mjx-texclass="ORD">
<mo stretchy="false">|</mo>
</mrow>
<mover>
<mrow>
<mi>x</mi>
<msub>
<mi>q</mi>
<mi>t</mi>
</msub>
</mrow>
<mo>→</mo>
</mover>
<mrow data-mjx-texclass="ORD">
<mo stretchy="false">|</mo>
</mrow>
<mo>≤</mo>
<mi>r</mi>
<mo stretchy="false">]</mo>
<mo stretchy="false">)</mo>
<mo>∘</mo>
<mrow data-mjx-texclass="INNER">
<mo data-mjx-texclass="OPEN">(</mo>
<munder>
<mo data-mjx-texclass="OP">⋃</mo>
<mrow data-mjx-texclass="ORD">
<msub>
<mi>x</mi>
<mi>g</mi>
</msub>
<mo>∈</mo>
<msup>
<mrow data-mjx-texclass="ORD">
<mi mathvariant="double-struck">Z</mi>
</mrow>
<mrow data-mjx-texclass="ORD">
<mn>342</mn>
</mrow>
</msup>
<mo>∧</mo>
<msub>
<mi>g</mi>
<mrow data-mjx-texclass="ORD">
<mi>t</mi>
<mi>m</mi>
</mrow>
</msub>
<mo>≤</mo>
<msub>
<mi>x</mi>
<mi>g</mi>
</msub>
<mo>≤</mo>
<msub>
<mi>g</mi>
<mrow data-mjx-texclass="ORD">
<mi>t</mi>
<mi>M</mi>
</mrow>
</msub>
</mrow>
</munder>
<mi>h</mi>
<mo stretchy="false">(</mo>
<msub>
<mi>x</mi>
<mi>g</mi>
</msub>
<mo stretchy="false">)</mo>
<mo data-mjx-texclass="CLOSE">)</mo>
</mrow>
</mtd>
</mtr>
<mtr>
<mtd>
<mtext>where</mtext>
</mtd>
<mtd></mtd>
</mtr>
<mtr>
<mtd>
<mi>R</mi>
</mtd>
<mtd>
<mi></mi>
<mo>=</mo>
<mo fence="false" stretchy="false">⌈</mo>
<mi>G</mi>
<mfrac>
<mi>r</mi>
<msub>
<mi>B</mi>
<mi>r</mi>
</msub>
</mfrac>
<mo fence="false" stretchy="false">⌉</mo>
</mtd>
</mtr>
<mtr>
<mtd>
<msub>
<mi>g</mi>
<mi>t</mi>
</msub>
</mtd>
<mtd>
<mi></mi>
<mo>=</mo>
<mi>trunc</mi>
<mo stretchy="false">(</mo>
<mi>g</mi>
<mo stretchy="false">(</mo>
<msub>
<mi>q</mi>
<mi>t</mi>
</msub>
<mo stretchy="false">)</mo>
<mo stretchy="false">)</mo>
</mtd>
</mtr>
<mtr>
<mtd>
<msub>
<mi>g</mi>
<mrow data-mjx-texclass="ORD">
<mi>t</mi>
<mi>m</mi>
</mrow>
</msub>
</mtd>
<mtd>
<mi></mi>
<mo>=</mo>
<mo data-mjx-texclass="OP" movablelimits="true">max</mo>
<mo stretchy="false">(</mo>
<msub>
<mi>g</mi>
<mi>t</mi>
</msub>
<mo>−</mo>
<mi>R</mi>
<mo>,</mo>
<mo stretchy="false">(</mo>
<mn>0</mn>
<mo>,</mo>
<mn>0</mn>
<mo>,</mo>
<mn>0</mn>
<mo stretchy="false">)</mo>
<mo stretchy="false">)</mo>
</mtd>
</mtr>
<mtr>
<mtd>
<msub>
<mi>g</mi>
<mrow data-mjx-texclass="ORD">
<mi>t</mi>
<mi>M</mi>
</mrow>
</msub>
</mtd>
<mtd>
<mi></mi>
<mo>=</mo>
<mo data-mjx-texclass="OP" movablelimits="true">min</mo>
<mo stretchy="false">(</mo>
<msub>
<mi>g</mi>
<mi>t</mi>
</msub>
<mo>+</mo>
<mi>R</mi>
<mo>,</mo>
<mo stretchy="false">(</mo>
<mi>G</mi>
<mo>−</mo>
<mn>1</mn>
<mo>,</mo>
<mi>G</mi>
<mo>−</mo>
<mn>1</mn>
<mo>,</mo>
<mi>G</mi>
<mo>−</mo>
<mn>1</mn>
<mo stretchy="false">)</mo>
<mo stretchy="false">)</mo>
</mtd>
</mtr>
</mtable>
</math>
<div class="mathnospace real">
<mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" display="true" tabindex="0" ctxtmenu_counter="293"><mjx-math display="true" style="margin-left: 0px; margin-right: 0px;" class="MJX-TEX" aria-hidden="true"><mjx-mtable style="min-width: 23.102em;"><mjx-table><mjx-itable><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-bottom: 0.15em;"><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D440 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em; margin-left: -0.081em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-bottom: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c21A6"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c5B"></mjx-c></mjx-mo><mjx-texatom texclass="ORD"><mjx-mo class="mjx-n"><mjx-c class="mjx-c7C"></mjx-c></mjx-mo></mjx-texatom><mjx-mover><mjx-over style="padding-bottom: 0.105em;"><mjx-mo class="mjx-n"><mjx-stretchy-h style="width: 1.356em;" class="mjx-c2192"><mjx-ext><mjx-c></mjx-c></mjx-ext><mjx-end><mjx-c></mjx-c></mjx-end></mjx-stretchy-h></mjx-mo></mjx-over><mjx-base><mjx-mrow><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45E TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em; margin-left: -0.014em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub></mjx-mrow></mjx-base></mjx-mover><mjx-texatom texclass="ORD"><mjx-mo class="mjx-n"><mjx-c class="mjx-c7C"></mjx-c></mjx-mo></mjx-texatom><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c2264"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="4"><mjx-c class="mjx-c1D45F TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c5D"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2218"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="3"><mjx-c class="mjx-c1D437 TEX-I"></mjx-c></mjx-mi><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c21D4"></mjx-c></mjx-mo><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D440 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em; margin-left: -0.081em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c21A6"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c5B"></mjx-c></mjx-mo><mjx-texatom texclass="ORD"><mjx-mo class="mjx-n"><mjx-c class="mjx-c7C"></mjx-c></mjx-mo></mjx-texatom><mjx-mover><mjx-over style="padding-bottom: 0.105em;"><mjx-mo class="mjx-n"><mjx-stretchy-h style="width: 1.356em;" class="mjx-c2192"><mjx-ext><mjx-c></mjx-c></mjx-ext><mjx-end><mjx-c></mjx-c></mjx-end></mjx-stretchy-h></mjx-mo></mjx-over><mjx-base><mjx-mrow><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45E TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em; margin-left: -0.014em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub></mjx-mrow></mjx-base></mjx-mover><mjx-texatom texclass="ORD"><mjx-mo class="mjx-n"><mjx-c class="mjx-c7C"></mjx-c></mjx-mo></mjx-texatom><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c2264"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="4"><mjx-c class="mjx-c1D45F TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c5D"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2218"></mjx-c></mjx-mo><mjx-mrow space="3"><mjx-mo class="mjx-n"><mjx-stretchy-v style="height: 3.436em; vertical-align: -1.468em;" class="mjx-c28"><mjx-beg><mjx-c></mjx-c></mjx-beg><mjx-ext><mjx-c></mjx-c></mjx-ext><mjx-end><mjx-c></mjx-c></mjx-end><mjx-mark></mjx-mark></mjx-stretchy-v></mjx-mo><mjx-munder><mjx-row><mjx-base style="padding-left: 2.867em;"><mjx-mo class="mjx-lop"><mjx-c class="mjx-c22C3 TEX-S2"></mjx-c></mjx-mo></mjx-base></mjx-row><mjx-row><mjx-under style="padding-top: 0.167em;"><mjx-texatom size="s" texclass="ORD"><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-mo class="mjx-n"><mjx-c class="mjx-c2208"></mjx-c></mjx-mo><mjx-msup><mjx-texatom texclass="ORD"><mjx-mi class="mjx-ds mjx-b"><mjx-c class="mjx-c2124 TEX-A"></mjx-c></mjx-mi></mjx-texatom><mjx-script style="vertical-align: 0.289em;"><mjx-texatom size="s" texclass="ORD"><mjx-mn class="mjx-n"><mjx-c class="mjx-c33"></mjx-c><mjx-c class="mjx-c34"></mjx-c><mjx-c class="mjx-c32"></mjx-c></mjx-mn></mjx-texatom></mjx-script></mjx-msup><mjx-mo class="mjx-n"><mjx-c class="mjx-c2227"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-texatom size="s" texclass="ORD"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45A TEX-I"></mjx-c></mjx-mi></mjx-texatom></mjx-script></mjx-msub><mjx-mo class="mjx-n"><mjx-c class="mjx-c2264"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-mo class="mjx-n"><mjx-c class="mjx-c2264"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-texatom size="s" texclass="ORD"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D440 TEX-I"></mjx-c></mjx-mi></mjx-texatom></mjx-script></mjx-msub></mjx-texatom></mjx-under></mjx-row></mjx-munder><mjx-mi class="mjx-i" space="2"><mjx-c class="mjx-c210E TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D465 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-stretchy-v style="height: 3.436em; vertical-align: -1.468em;" class="mjx-c29"><mjx-beg><mjx-c></mjx-c></mjx-beg><mjx-ext><mjx-c></mjx-c></mjx-ext><mjx-end><mjx-c></mjx-c></mjx-end><mjx-mark></mjx-mark></mjx-stretchy-v></mjx-mo></mjx-mrow><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mtext class="mjx-n"><mjx-c class="mjx-c77"></mjx-c><mjx-c class="mjx-c68"></mjx-c><mjx-c class="mjx-c65"></mjx-c><mjx-c class="mjx-c72"></mjx-c><mjx-c class="mjx-c65"></mjx-c></mjx-mtext><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D445 TEX-I"></mjx-c></mjx-mi><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c2308"></mjx-c></mjx-mo><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D43A TEX-I"></mjx-c></mjx-mi><mjx-mfrac><mjx-frac type="d"><mjx-num><mjx-nstrut type="d"></mjx-nstrut><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45F TEX-I"></mjx-c></mjx-mi></mjx-num><mjx-dbox><mjx-dtable><mjx-line type="d"></mjx-line><mjx-row><mjx-den><mjx-dstrut type="d"></mjx-dstrut><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D435 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D45F TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub></mjx-den></mjx-row></mjx-dtable></mjx-dbox></mjx-frac></mjx-mfrac><mjx-mo class="mjx-n"><mjx-c class="mjx-c2309"></mjx-c></mjx-mo><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mi class="mjx-n" space="4"><mjx-c class="mjx-c74"></mjx-c><mjx-c class="mjx-c72"></mjx-c><mjx-c class="mjx-c75"></mjx-c><mjx-c class="mjx-c6E"></mjx-c><mjx-c class="mjx-c63"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45E TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em; margin-left: -0.014em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-texatom size="s" texclass="ORD"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45A TEX-I"></mjx-c></mjx-mi></mjx-texatom></mjx-script></mjx-msub><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em; padding-bottom: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c6D"></mjx-c><mjx-c class="mjx-c61"></mjx-c><mjx-c class="mjx-c78"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2212"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="3"><mjx-c class="mjx-c1D445 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="2"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-mn class="mjx-n"><mjx-c class="mjx-c30"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="2"><mjx-c class="mjx-c30"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="2"><mjx-c class="mjx-c30"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr><mjx-mtr><mjx-mtd style="text-align: right; padding-right: 0px; padding-top: 0.15em;"><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-texatom size="s" texclass="ORD"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D440 TEX-I"></mjx-c></mjx-mi></mjx-texatom></mjx-script></mjx-msub><mjx-tstrut></mjx-tstrut></mjx-mtd><mjx-mtd style="text-align: left; padding-left: 0px; padding-top: 0.15em;"><mjx-mi class="mjx-n"></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c6D"></mjx-c><mjx-c class="mjx-c69"></mjx-c><mjx-c class="mjx-c6E"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-msub><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D454 TEX-I"></mjx-c></mjx-mi><mjx-script style="vertical-align: -0.15em;"><mjx-mi class="mjx-i" size="s"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi></mjx-script></mjx-msub><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2B"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="3"><mjx-c class="mjx-c1D445 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo><mjx-mo class="mjx-n" space="2"><mjx-c class="mjx-c28"></mjx-c></mjx-mo><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D43A TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2212"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="3"><mjx-c class="mjx-c31"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="2"><mjx-c class="mjx-c1D43A TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2212"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="3"><mjx-c class="mjx-c31"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo><mjx-mi class="mjx-i" space="2"><mjx-c class="mjx-c1D43A TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="3"><mjx-c class="mjx-c2212"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="3"><mjx-c class="mjx-c31"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo><mjx-tstrut></mjx-tstrut></mjx-mtd></mjx-mtr></mjx-itable></mjx-table></mjx-mtable></mjx-math><mjx-assistive-mml unselectable="on" display="block"><math xmlns="http://www.w3.org/1998/Math/MathML" display="block"><mtable columnalign="right left" columnspacing="0em" rowspacing="3pt" displaystyle="true"><mtr><mtd><msub><mi>M</mi><mi>t</mi></msub></mtd><mtd><mi></mi><mo>=</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">↦</mo><mo stretchy="false">[</mo><mrow data-mjx-texclass="ORD"><mo stretchy="false">|</mo></mrow><mover><mrow><mi>x</mi><msub><mi>q</mi><mi>t</mi></msub></mrow><mo>→</mo></mover><mrow data-mjx-texclass="ORD"><mo stretchy="false">|</mo></mrow><mo>≤</mo><mi>r</mi><mo stretchy="false">]</mo><mo stretchy="false">)</mo><mo>°</mo><mi>D</mi></mtd></mtr><mtr><mtd></mtd><mtd><mi></mi><mo stretchy="false">⇔</mo></mtd></mtr><mtr><mtd><msub><mi>M</mi><mi>t</mi></msub></mtd><mtd><mi></mi><mo>=</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">↦</mo><mo stretchy="false">[</mo><mrow data-mjx-texclass="ORD"><mo stretchy="false">|</mo></mrow><mover><mrow><mi>x</mi><msub><mi>q</mi><mi>t</mi></msub></mrow><mo>→</mo></mover><mrow data-mjx-texclass="ORD"><mo stretchy="false">|</mo></mrow><mo>≤</mo><mi>r</mi><mo stretchy="false">]</mo><mo stretchy="false">)</mo><mo>°</mo><mrow data-mjx-texclass="INNER"><mo data-mjx-texclass="OPEN">(</mo><munder><mo data-mjx-texclass="OP">⋃</mo><mrow data-mjx-texclass="ORD"><msub><mi>x</mi><mi>g</mi></msub><mo>∈</mo><msup><mrow data-mjx-texclass="ORD"><mi mathvariant="double-struck">Z</mi></mrow><mrow data-mjx-texclass="ORD"><mn>342</mn></mrow></msup><mo>∧</mo><msub><mi>g</mi><mrow data-mjx-texclass="ORD"><mi>t</mi><mi>m</mi></mrow></msub><mo>≤</mo><msub><mi>x</mi><mi>g</mi></msub><mo>≤</mo><msub><mi>g</mi><mrow data-mjx-texclass="ORD"><mi>t</mi><mi>M</mi></mrow></msub></mrow></munder><mi>h</mi><mo stretchy="false">(</mo><msub><mi>x</mi><mi>g</mi></msub><mo stretchy="false">)</mo><mo data-mjx-texclass="CLOSE">)</mo></mrow></mtd></mtr><mtr><mtd><mtext>where</mtext></mtd><mtd></mtd></mtr><mtr><mtd><mi>R</mi></mtd><mtd><mi></mi><mo>=</mo><mo fence="false" stretchy="false">⌈</mo><mi>G</mi><mfrac><mi>r</mi><msub><mi>B</mi><mi>r</mi></msub></mfrac><mo fence="false" stretchy="false">⌉</mo></mtd></mtr><mtr><mtd><msub><mi>g</mi><mi>t</mi></msub></mtd><mtd><mi></mi><mo>=</mo><mi>trunc</mi><mo stretchy="false">(</mo><mi>g</mi><mo stretchy="false">(</mo><msub><mi>q</mi><mi>t</mi></msub><mo stretchy="false">)</mo><mo stretchy="false">)</mo></mtd></mtr><mtr><mtd><msub><mi>g</mi><mrow data-mjx-texclass="ORD"><mi>t</mi><mi>m</mi></mrow></msub></mtd><mtd><mi></mi><mo>=</mo><mo data-mjx-texclass="OP" movablelimits="true">max</mo><mo stretchy="false">(</mo><msub><mi>g</mi><mi>t</mi></msub><mo>−</mo><mi>R</mi><mo>,</mo><mo stretchy="false">(</mo><mn>0</mn><mo>,</mo><mn>0</mn><mo>,</mo><mn>0</mn><mo stretchy="false">)</mo><mo stretchy="false">)</mo></mtd></mtr><mtr><mtd><msub><mi>g</mi><mrow data-mjx-texclass="ORD"><mi>t</mi><mi>M</mi></mrow></msub></mtd><mtd><mi></mi><mo>=</mo><mo data-mjx-texclass="OP" movablelimits="true">min</mo><mo stretchy="false">(</mo><msub><mi>g</mi><mi>t</mi></msub><mo>+</mo><mi>R</mi><mo>,</mo><mo stretchy="false">(</mo><mi>G</mi><mo>−</mo><mn>1</mn><mo>,</mo><mi>G</mi><mo>−</mo><mn>1</mn><mo>,</mo><mi>G</mi><mo>−</mo><mn>1</mn><mo stretchy="false">)</mo><mo stretchy="false">)</mo></mtd></mtr></mtable></math></mjx-assistive-mml></mjx-container>
</div>
vs in vivo
This example does have them, and all the positioning works. It's not, like, perfect or whatever, but it's pretty okay.
Yeah obviously the font is different, I didn't force a non-default font. This is to illustrate that this works by default and MathJax chooses to break it. But, sure, if the font could be the issue, just the font bits can be applied:
.MJX-TEX {
font-family: MJXZERO, MJXTEX;
}
.TEX-B {
font-family: MJXZERO, MJXTEX-B;
}
.TEX-I {
font-family: MJXZERO, MJXTEX-I;
}
.TEX-MI {
font-family: MJXZERO, MJXTEX-MI;
}
.TEX-BI {
font-family: MJXZERO, MJXTEX-BI;
}
.TEX-S1 {
font-family: MJXZERO, MJXTEX-S1;
}
.TEX-S2 {
font-family: MJXZERO, MJXTEX-S2;
}
.TEX-S3 {
font-family: MJXZERO, MJXTEX-S3;
}
.TEX-S4 {
font-family: MJXZERO, MJXTEX-S4;
}
.TEX-A {
font-family: MJXZERO, MJXTEX-A;
}
.TEX-C {
font-family: MJXZERO, MJXTEX-C;
}
.TEX-CB {
font-family: MJXZERO, MJXTEX-CB;
}
.TEX-FR {
font-family: MJXZERO, MJXTEX-FR;
}
.TEX-FRB {
font-family: MJXZERO, MJXTEX-FRB;
}
.TEX-SS {
font-family: MJXZERO, MJXTEX-SS;
}
.TEX-SSB {
font-family: MJXZERO, MJXTEX-SSB;
}
.TEX-SSI {
font-family: MJXZERO, MJXTEX-SSI;
}
.TEX-SC {
font-family: MJXZERO, MJXTEX-SC;
}
.TEX-T {
font-family: MJXZERO, MJXTEX-T;
}
.TEX-V {
font-family: MJXZERO, MJXTEX-V;
}
.TEX-VB {
font-family: MJXZERO, MJXTEX-VB;
}
mjx-stretchy-v mjx-c, mjx-stretchy-h mjx-c {
font-family: MJXZERO, MJXTEX-S1, MJXTEX-S4, MJXTEX, MJXTEX-A ! important;
}
@font-face /* 0 */ {
font-family: MJXZERO;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Zero.woff") format("woff");
}
@font-face /* 1 */ {
font-family: MJXTEX;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Main-Regular.woff") format("woff");
}
@font-face /* 2 */ {
font-family: MJXTEX-B;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Main-Bold.woff") format("woff");
}
@font-face /* 3 */ {
font-family: MJXTEX-I;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Math-Italic.woff") format("woff");
}
@font-face /* 4 */ {
font-family: MJXTEX-MI;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Main-Italic.woff") format("woff");
}
@font-face /* 5 */ {
font-family: MJXTEX-BI;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Math-BoldItalic.woff") format("woff");
}
@font-face /* 6 */ {
font-family: MJXTEX-S1;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Size1-Regular.woff") format("woff");
}
@font-face /* 7 */ {
font-family: MJXTEX-S2;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Size2-Regular.woff") format("woff");
}
@font-face /* 8 */ {
font-family: MJXTEX-S3;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Size3-Regular.woff") format("woff");
}
@font-face /* 9 */ {
font-family: MJXTEX-S4;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Size4-Regular.woff") format("woff");
}
@font-face /* 10 */ {
font-family: MJXTEX-A;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_AMS-Regular.woff") format("woff");
}
@font-face /* 11 */ {
font-family: MJXTEX-C;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Calligraphic-Regular.woff") format("woff");
}
@font-face /* 12 */ {
font-family: MJXTEX-CB;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Calligraphic-Bold.woff") format("woff");
}
@font-face /* 13 */ {
font-family: MJXTEX-FR;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Fraktur-Regular.woff") format("woff");
}
@font-face /* 14 */ {
font-family: MJXTEX-FRB;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Fraktur-Bold.woff") format("woff");
}
@font-face /* 15 */ {
font-family: MJXTEX-SS;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_SansSerif-Regular.woff") format("woff");
}
@font-face /* 16 */ {
font-family: MJXTEX-SSB;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_SansSerif-Bold.woff") format("woff");
}
@font-face /* 17 */ {
font-family: MJXTEX-SSI;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_SansSerif-Italic.woff") format("woff");
}
@font-face /* 18 */ {
font-family: MJXTEX-SC;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Script-Regular.woff") format("woff");
}
@font-face /* 19 */ {
font-family: MJXTEX-T;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Typewriter-Regular.woff") format("woff");
}
@font-face /* 20 */ {
font-family: MJXTEX-V;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Vector-Regular.woff") format("woff");
}
@font-face /* 21 */ {
font-family: MJXTEX-VB;
src: url("http://cdn.jsdelivr.net/npm/[email protected]/es5/output/chtml/fonts/woff-v2/MathJax_Vector-Bold.woff") format("woff");
}
and applying class="MJX-TEX" to the mathml bits:
This works, as do whole-word searches. The layout is unaffected. The metrics appear standard. It's still not perfect, but the stuff you've indicated wouldn't work does, so.
With that established: no it isn't. Nigh-on each visible character is a ::before, yes, but with
mjx-c::before {
display: block;
width: 0;
}
which naturally breaks word welding. Making it
mjx-c::before {
display: inline-block;
width: 0;
}
fixes it. Compare, on a live mathjax render:
with
Self-evidently, the layout is perfectly possible with CSS not like that, so one would hope this weren't the expected behaviour.
This also appears fixed in v4 (tested with
<script id="MathJax-script" defer src="//cdn.jsdelivr.net/npm/[email protected]/tex-chtml.js"></script>
) where whole-words searches work and every character is in a display:inline-block/width:0 box (admittedly not in a ::before, but, implementation detail) so (a) this does appear to have a canonical solution, just not present in v3 and (b) the v4 tag is wrong.
I would be remiss to not also note that during this test v4 seems to have pegged a CPU for like a good minute at least, while v3 always completes in at most 3s.
This example does have them, and all the positioning works. It's not, like, perfect or whatever, but it's pretty okay.
Your example file is showing the browser's native MathML output in both sets of equations that you have included. The first set is explicitly MathML, and the second, where you have copied the mjx-container produced by MathJax, is also showing the browser's native MathML rendering, because that mjx-container includes the MathML for the expression in a mjx-assitive-mml tag that is there for screen readers that understand MathML, but normally is hidden (for the visual users) by the MathJax CSS that you have left out. That means the MathML is being shown instead of being hidden, and that is what you are seeing in both cases. That is why they look identical, and why the changes you make later don't affect it.
The tags generated by the MathJax CHTML output are in the page, but they have no content (other than the assistive MathML), and so are showing nothing. They are actually what forms the blank line between the two MathML renderings. Without the CSS, they collapse to virtually nothing.
This is to illustrate that this works by default and MathJax chooses to break it.
It is true that MathML does work in most modern browsers at this point, though it is a limited version called MathML-Core that does not implement all the MathML that MathJax relies on. If you want to use the native MathML support in your browser, that is fine (if "pretty OK" is all you need). But that is not what the usual MathJax output is. You are only seeing the MathML rendering because of the missing CSS. That's not "breaking it", you just aren't looking at the actual MathJax output.
if the font could be the issue, just the font bits can be applied ... and applying
class="MJX-TEX"to the mathml bits:
I'm not sure what you mean by "applying class="MJX-TEX" to the mathml bits", as you haven't provided a file that does what you are suggesting. If it was to add a style tag that includes the given CSS styles, then since class="MJX-TEX" is only on the mjx-math element, while the mjx-assistive-mml tag is outside of that, the styles won't be applied to the MathML at all. So that CSS will have not effect on the output you are seeing, as you found out ("The layout is unaffected"). While it is possible to use CSS to style MathML, though I've never investigated that, I don't think the MathML element inherit the fonts from the surrounding element, so setting the font-family on a container element won't affect the MathML within it in any case. So even if you added class="MJX-TEX" to the mjx-assistive-mml element, I don't think that will change the result.
Nigh-on each visible character is a
::before
Yes, and without the CSS that includes that, you won't see those character in the MathJax output, because the ::before that inserts the character isn't there. So the MathJax output is empty even with class="MJX-TEX", and only the assistive MathML is showing, not the MathJax output. You are also missing all the CSS that performs the layout of subscripts, superscripts, and fractions, and all the rest, so even if you got the characters, they would not be in the proper places.
With that established: no it isn't.
Nothing established: yes, it is. I'm sorry, but most of your examples don't show what you think they do. Only the last images with live MathJax do, but see below.
Self-evidently, the layout is perfectly possible with CSS not like that
It's not self evident at all, since all your discussion above is actually about native MathML output, not MathJax's CHTML layout. And your solution is to use display: inline-block, so "CSS like that", just as I said. I said we needed to use things like inline-block in order to get the layout, and we do. You have certainly not shown otherwise. Of course, if you want to use native MathML support, that is entirely different, and you don't need MathJax for that (except perhaps to convert LaTeX to MathML, but that has nothing to do with MathJax's CHTML output).
I've been working on MathJax v4 for several years, and I'm afraid I don't always remember the specifics of the changes from v3. I had forgotten that v3 uses display: block rather than display: inline-block for the mjx-c nodes, so I was wrong about the exact CSS, but I was correct that it was the display property that was at issue. I'm glad (though a bit surprised) that inline-block resolves the problem. As you point out, v4 uses that rather than block.
so one would hope this weren't the expected behaviour.
The "expected behavior" tag means "This is how MathJax works". Based on the information you provided, the display CSS seemed to be the most likely culprit (and apparently it is). I'm glad that a change from block to inline-block is sufficient to get it to work the way you would like. Of course, this may also make things into words that you don't want to be words. For example, it may mean that in something like (x+y)^2 = x^2 + 2 xy + y^2, searching for x will not locate the one in xy, as that would now be considered a word rather than a product of two words. But perhaps the fact that the mjx-c tags are not siblings in this case will make it work.
Just for anyone else coming here, a work-around in v3 is to add
mjx-c::before {
display: inline-block ! important;
}
to your page's CSS.
during this test v4 seems to have pegged a CPU for like a good minute at least, while v3 always completes in at most 3s.
In v4, the assistive tools are turned on by default, where they are off by default in v3. Changes in these tools in v4.0-beta.7 caused a performance problem, which is recently fixed in the develop branch, and will be part of the upcoming beta.8 release.
Fixed in v4.0.