Search code examples
phpmathjax

Formatting fraction fir display

I'm formatting fraction with MathJax and are having problem displaying it properly.

$disp = '<h1>$${{10 \over 9 }} of 99 $$</h1><br>';
echo $disp;

enter image description here For some reason, i cannot get a space before and after the word 'of'. Any pointers is greatly appreciated. Thanx in advance.

Solution

  • This is better handled as

    $disp = '<h1>$${10 \over 9}\text{ of }99$$</h1><br>';

    as the accepted answer does not get the font or spacing for "of" correct.

    It also seems that you may be using <H1> simply to get a larger size. If so, that is bad practice, as <H1> is a structural element indicating a top-level heading (not a layout element for a larger size). Unless this expression really is a top-level heading, you should not use <H1> for it. For example, people using assistive technology like screen readers often are given a list of the headings so they can quickly jump to the important starting points of your page, so if you make all your expressions be headings, that will complicate their already difficult task of navigating your page.

    Layout should be controlled by CSS, so you could use a <div> with a class around your display math if you want to size it. Or you could use one of the TeX macros like \Large or \LARGE to make the math larger from within the expression. But don't use a heading indicator unless it really is the start of a new section of your page.

    Here are some examples:

    .dmath {
  font-size: 200%;
}
    <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>

Bad:

<h1>$${10 \over 9} of 9$$</h1>

Better using CSS and <code>\text{}</code>:

<div class="dmath">
$${10 \over 9}\text{ of }9$$
</div>

Better using <code>\LARGE</code> and <code>\text{}</code>:

$$\LARGE {10 \over 9}\text{ of }9$$

<br><br><br><br>