Display math formula with text inputs using MathJax with MathML input and CSS/HTML rendering

Question

I have mathML input wraped in script tag like this:

<script type="math/mml" id="scriptTag">
  <math>
    <mfrac>
      <msqrt>
        <mn>
          <semantics>
            <annotation-xml encoding='application/xhtml+xml'>
              <input xmlns='http://www.w3.org/1999/xhtml' type='text' size='4' />
            </annotation-xml>
          </semantics>
       </mn>
     </msqrt>
     <mn> 3 </mn>
    </mfrac>
  </math>
</script>

And after rendering it with MathJax, textbox is realy small. I tried css also on it, but nothing changed. Is there a way to make css work on it, or MathJax render it with desired size?

Answer 1

MathJax parses the MathML and outputs DOM elements. You could inspect and directly style the output elements, or you can use MathJax CSS Objects in javascript.