Can LaTeX Profiles be Rendered
Adequately with Static CSS?

William F. Hammond

San Diego

TUG 2014
Portland Oregon
July 2014

ABSTRACT

Can LaTeX Profiles be Rendered Adequately with Static CSS?

MathJax demonstrates that heavy customization of CSS with JavaScript and webfonts provides good platform-dependent rendering. The issue with MathJax is speed, not quality.

There has been and continues to be intense development with CSS. One may speculate that, as CSS continues to evolve, static CSS may entirely suffice not only for HTML documents but also for the direct online rendering of profiled LaTeX documents when presented using XML syntax.

1.  Disclaimer

Image file: manfnt-11-7f.png This is about Work in Progress

  • CSS: cascading style sheets

  • CSS is “designer language” for XML (and HTML)

  • Author not an expert on CSS

  • CSS itself is under development, particularly with respect to vertical alignment

  • CSS styling of XML (math in particular) has improved greatly in the last 5 years

2.  About These Slides

These slides are an example of the subject of the talk.
source markupprofilesViaCss.glm
Latin Modern XMLprofilesViaCss-lm.xml
XITS XMLprofilesViaCss-xi.xml
GNU FreefontprofilesViaCss-gf.xml
For those with challenged web browsers there is also:
HTMLprofilesViaCss.html
PDFprofilesViaCss.pdf (suitable for printing)

3.  A Thematic Poster

Frivolity. Empty colored flexible rows and columns were drawn somewhat haphazardly. Some boxes were given borders, but many were not. Finally little bits of mathematics were entered.
CSS Flexible Box Scatter Painting

(This poster was written in HTML rather than in profiled LaTeX, but it relies only on static CSS.)

Image file: fscratchpvc.png

4.  A calculus handout

Online notes on the Gamma function from an honors freshman calculus class that I taught in 1995

These three fonts are nearly consistent with respect to CSS. Aside from font invocation, the variations have to do with margin settings for

\sqrt (radical symbol and index).
\overset and \underset.
the eight math accents in the profile.

5.  Handling of Fractions

Fractions are handled as CSS tables. BUT

  • Must be treated as if \frac{{a}}{{b}}, so that the 2 x 1 table has both rows and cells

  • Bar in middle is “collapsed” common horizontal border (the row role)

  • Content of numerator & denominator must be allowed to contain fractions (the cell role)

  • Wanted: a CSS model for columns

6.  Nested Parentheses

Compare

7.  Handling of Parentheses

  • Implemented as CSS borders using border-radius.

  • Perfectly-sized.

  • This approach not presently useable with brackets and braces.

See gamma-lm.xml.
Image file: dloggammasm.png

8.  Math that is challenging to set

Maintaining vertical alignment is a challenge for things like infinite series, oversets, math accents, and especially for fractions.

Lots of examples:

9.  CSS Flexible Boxes

In the second instance the flexible rows have blue horizontal borders, while the flexible columns have red vertical borders.

10.  Typesetting on paper

Shouldn't LaTeX engines be taught to typeset profiled LaTeX with CSS? A good CSS engine gives one fine control of margins, borders, and padding.

11.  The CSS Future

END