Forum Samples, Tips and Tricks

Mathematics with XML and CSS

George Chavchanidze has done some amazing work making CSS style sheets for rendering mathematics, including fractions and all kinds of complicated formulae that look as if they were done with LaTeX or MathML, but are actually pure XML with CSS.

His site includes style sheets for browsers like Opera/Firefox/Safari, and now also a CSS 3 math style sheet for use with Prince! :D

It is worth trying some of his sample documents, just to get an idea of how much can be done with CSS.

Math on the web is particularly interesting to us. We make math equations with Latex (inline and block) and convert them to bitmaps on-the-fly for web use (

I've noticed a product called Tralics ( that translates Latex into XML. Does this look like a solution that would be compatible with Prince? Do you have anything else to suggest?

John Clarke
Cornerstone Systems Northwest Inc.

From a quick look at the Tralics converter it seems that it converts LaTeX to MathML, which is the W3C's XML vocabulary for mathematics.

Prince does not support MathML yet, although we do have a prototype implementation that we hope to include in a future release.

George's approach for representing mathematics with XML and CSS that can be used within XHTML is another option, but I'm not sure what would be the best method of getting there from LaTeX -- any tips George? :)
There are many LaTeX to (X)HTML converters [1] that produce different output: (X)HTML + images (PNG or GIF), XHTML + MathML
or presentational HTML with many nested tables. XHTML with images should work in Prince (but will results large size of PDF output). Oldfashioned HTML with complex tabular layouts is not good solution either.
XHTML + MathML is better solution, however MathML by design is slightly awkward for CSS formatting. W3C tries to address [2] this issue by introducing CSS3 math module [3] but at the moment it seems to
be hard to design "universal" CSS style sheet for MathML without reforming MathML markup language itself. There are tools that transform MathML into SVG, Prince can process SVG so one may try XHTML + SVG solution.

We tried to go in different way and designed experimental mathematical markup language [4] that from one hand is fully integrated into XML + CSS framework and from another hand is (or claims to be) human processable (not as verbose as MathML) so authors could code it manually in source editors like they code XHTML or maybe LaTeX. Now we use one XML markup for both authoring and delivery [5] of mathematical articles. This solution is compatible with Prince [6] but we don't have any LaTeX to XML converters as we don't use LaTeX as input/authoring format.
There is also lightweight XHTML based solution [7] for those who either is not familiar with XML/CSS or does not like XML approach. In future when capabilities of CSS3 in general and its math module (if any) in paticular will be clearly outlined we plan to amend current experimental markup
and turn it into more powerful environment for authoring of mathematical articles.

[1] Some LaTeX to (X)HTML converters
[2] MathML and CSS
[3] Discussion on CSS3 math module
[4] XML MAIDEN 1.1
[5] Math articles in XML and XHTML
[6] Style sheets for Prince
[7] Simplified approach
Note that recently capabilities of math.css style sheet were improved and now it handles arbitrary complex math formulae obtained by combining and nesting subscripts, superscripts, prescripts, under and over scripts, fractions, operators, matrices, vectors, determinants, cases, accents, fences, radical and other mathematical expressions.

Markup language was also rewritten from top to bottom to remove all nesting restrictions. Preliminary documentation is posted
It is still on beta stage and feedback is welcomed.

Prince 5b4 can process all sample pages including 'torture' and 'stress', and does not fail on deep nesting patterns.