Search code examples
javascripthtmlmathml

mathml conversion: MathClass-rel dont displays correctly with <mrow> and <mfrac>

The following code is (the result) of tex to html conversion using make4ht command

<!DOCTYPE html> 
<html lang='en-US' xml:lang='en-US'> 
<head><title></title> 
<meta charset='utf-8' /> 
<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/latest.js?config=MML_HTMLorMML'></script>  
</head>
<body>
<div class='par-math-display'>
<math display='block' xmlns='http://www.w3.org/1998/Math/MathML'>
    <mrow>
        <mo class='MathClass-rel'>∥</mo>
        <mi>x</mi>
        <mo class='MathClass-rel'>∥</mo> 
        <mo class='MathClass-rel'>=</mo> 
        <mfrac>
            <mrow>
                <mo class='MathClass-rel'>∥</mo>
                <mi>x</mi>
                <mo class='MathClass-rel'>∥</mo>
            </mrow> 
            <mrow>
                <mn>1</mn>
            </mrow>
        </mfrac>
    </mrow>
</math>
</div>
<p class='nopar'> and</p>
<div class='math-display'>
<math display='block' xmlns='http://www.w3.org/1998/Math/MathML'>
    <mrow>
        <mo class='MathClass-rel'>|</mo>
        <mi>x</mi>
        <mo class='MathClass-rel'>|</mo>
        <mo class='MathClass-rel'>=</mo> 
        <mfrac>
            <mrow>
                <mo class='MathClass-rel'>|</mo>
                <mi>x</mi>
                <mo class='MathClass-rel'>|</mo>
            </mrow> 
            <mrow>
                <mn>1</mn>
            </mrow>
        </mfrac>
    </mrow>
</math>
</div>
<p class='nopar'> </p> 
</body> 
</html>

It displays as

enter image description here

with Chrome and Firefox. But what i want is the following (this image is the pdf result of latex)

enter image description here

I am not familiar with mathml but i am trying, so any help please.

Solution

  • You want

       <mrow>
        <mo class='MathClass-rel'>∥</mo>
        <mi>x</mi>
        <mo class='MathClass-rel'>∥</mo> 
    </mrow>

    so the two || are stretched to the size of the x (ie their containing mrow)

    The first one is rendering incorrectly, the two || around the x should be the same size, as in the second example, with | which seems to be a mathjax issue, but as you don#t want that layout anyway add an mrow just around the norm x.