Skip navigation.

CSS Warrior

MathML in Opera and Safari

While working on CSS formattable MathML profile, I noticed that MathML actually admits serialization that one could feed to any CSS2.1 rendering engine (including Opera 9, Prince formatter 6, Safari 3 and Mozilla browsers based on Gecko 1.9a3 or later).
Here is demo page: http://xml-maiden.com/mathml/mini/stress.xhtml

While this particular serialization sucks (mostly due to workarounds for browser bugs and lack of some crucial CSS3 stuff that is not yet implemented in browsers), generally speaking CSS rendering engines have necessary functionality to handle complex inline expressions and if we'll manage to ship reasonable MathML profile that works in CSS environment then barrier for adoption of MathML on web will be reduced significantly.

The trick with serialization above is that CSS can handle many MathML layout schemata provided that order of child elements follows their inflow order so for instance
<mroot>
 <mi>radix</mi>
 <mi>radicand</mi>
</mroot>

would work while
<mroot>
 <mi>radicand</mi>
 <mi>radix</mi>
</mroot>

is not easy to handle with CSS. One can rewrite MathML example above as
<mroot>
 <maction>
  <mi>radicand</mi>
  <mi>radix</mi>
 </maction>
 <maction>
  <mi>radix</mi>
  <mi>radicand</mi>
 </maction>
</mroot>

Then for native MathML formatters it is equivalent to
<mroot>
 <mi>radicand</mi>
 <mi>radix</mi>
</mroot>

due to fallback behaviour that maction has, while CSS formatters can pick elements in order that matches normal flow. By applying such cyclic permutation to mover, munderover, mroot and msubsup one can get MathML serialization that is CSS2.1 formattable.
Here is example: http://xml-maiden.com/mathml/basic/stress.xhtml
It is one bug away from working in Safari (baseline alignment of inline-tables is broken) so the demo page mentioned in the beggining of post relies on extra workarounds for that bug.

Note that with CSS3 named flows one could avoid maction monkey business, but browsers are not there yet. Once we get there then adding support for appropriate MathML profile should be easy for most of web browsers.

Mathematical formulae in new dimensionMathML in Opera 9.5

Write a comment

You must be logged in to write a comment. If you're not a registered member, please sign up.