|
Posted by David Ross on June 29, 2005, 11:41 am
Please log in for more thread options
selowitch@gwi.net wrote:
>
> I've been searching in vain for a way to present typographically
> correct fractions (not resorting to <sup> and <sub> tags) but have been
> frustrated by the fact that the glyphs for one-half, one-eighth,
> three-quarters, etc. do not display in the correct typeface (or even
> consistently the same typeface) and seem totally resistant to attempt
> to fix this through CSS:
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
> "http://www.w3.org/TR/html4/loose.dtd">
> <html lang="en">
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
> <meta http-equiv="Content-Style-Type" content="text/css">
> <meta http-equiv="Content-Language" content="en">
> <table>
> <tr valign="top"><td>¼</td></tr>
> <tr valign="top"><td>½</td></tr>
> <tr valign="top"><td>¾</td></tr>
> <tr valign="top"><td>⅓</td></tr>
> <tr valign="top"><td>⅔</td></tr>
> <tr valign="top"><td>⅕</td></tr>
> <tr valign="top"><td>⅖</td></tr>
> <tr valign="top"><td>⅗</td></tr>
> <tr valign="top"><td>⅘</td></tr>
> <tr valign="top"><td>⅙</td></tr>
> <tr valign="top"><td>⅚</td></tr>
> <tr valign="top"><td>⅛</td></tr>
> <tr valign="top"><td>⅜</td></tr>
> <tr valign="top"><td>⅝</td></tr>
> </table>
> </body>
> </html>
>
> Any thoughts of a solution (other than using inlines like 1/2, 3/4,
> etc. or other hacks)?
First of all, I hope you have a </head> and <body> between the last
<meta> and the <table>.
For fractions that have entity references in the HTML 4.01
specification, use them in place of the numeric character
references:
¼ for 1/4
½ for 1/2
¾ for 3/4
If the glyphs exist in the viewer's display font, this will work.
For other fractions (and for the above three, if you choose),
create a style that displays the inlines with a smaller font
relative to the current font-size and slightly elevated. For
example:
.fract { font-size: 80%; vertical-align: 20% }
Then use
<p>1 = <span class=fract>1/3</span> + <span class=fract>2/3</span>
This will work even if the viewer does not have fractional glyphs.
Actually, I would probably use <font> in place of <span> because
the effect is supposed to change the size font. I know <font> is
deprecated, but its use here would be mnemonic when I manually edit
an HTML file.
--
David E. Ross
<URL:http://www.rossde.com/>
I use Mozilla as my Web browser because I want a browser that
complies with Web standards. See <URL:http://www.mozilla.org/>.
|