Typesetting Tip #7: Fractions & Math

Fractions such as: ½, ¼, ¾, and other math symbols should all be displayed properly using the appropriate HTML entity. While there is not an HTML solution for typesetting every possible fraction or mathematical equation, there are basic entities that cover the most commonly used fractions and math symbols.

  1. (½) one-half (½)
  2. (¼) one-fourth (¼)
  3. (¾) three-fourths (¾)
  4. (⁄) fraction slash (⁄)
  5. (×) times symbol (×)
  6. (÷) divide symbol (÷)

Basic Rules

If you must create fractions you should use the fraction slash (⁄) instead of the typical forward slash on the keyboard. Fractions could also be created by using a combination of <sup> and <sub> tags with the fraction slash, although there may be issues with line-height (some browsers seem to add line-height when the superscript and subscript tags are used).

Example: 1⁄14 (does not display properly on IE).

When displaying dimensions (such as screen resolutions) or multiplication statments the times symbol should be used and not the letter X.

Example: Use (1024×768) not (1024X768)

posted by John Dilworth on Monday, Oct 30, 2006
tagged with typography