writing fractions in html

one over 100

[click watcher]

am wanting to write

1/100 more elegantly similiar to using &frac
but that only works with 2 digits any ideas??

[pageoneresults]

Hmmm, that will be a tricky one. There are no encoding characters that I've seen that will allow you to do this. Maybe through CSS. As far as I know, these are the three that are supported: ¼ ½ ¾

[tedster]

You might try combining <sup> and <sup>

I got some interesting results with:

^{<font size=-2>1</font>}/_{<font size=-2>100</font>}

On the board here:

¹/₁₀₀

[click watcher]

wow 2 people at hand really quick, thanks

you know you're never working alone when logged on at WMW :)

[pageoneresults]

Here is some more information on making fractions...

Fractions
For fractions like 6/7, the common linearized notation is usually the best, especially within running text. Attempts to create genuinely two-dimensional appearance, with a horizontal line and the nominator above it and the denominator below it, would require relatively complicated techniques. Here we consider "pseudo-twodimensionality".

If the only fractions in your document are vulgar fractions ½, ¼, ¾, you might consider using the ISO Latin 1 characters for them, e.g. as entity references ½, ¼, ¾. But if you need other fractions too, this is not a good idea since it would be odd if different fractions have essentially different appearances. In Unicode there are a few more fraction characters (namely for 1/3, 2/3, 1/5, 2/5, 3/5, 4/5, 1/6, 5/6, 1/8, 3/8, 5/8, 7/8), in the Number Forms block, but that would not enrich the repertoire much, and they don't work very widely, as explained in the Special characters section.

Tedsters Suggestion
You might use a linear notation with sup markup for the nominator and the sub markup for the denominator. The main problems is then that an expression like 5/8 tends to cause uneven line spacing, due to the poor quality of implementation of superscript and subscript style in most browsers.

It seems that the ideal solution would be to use the fraction slash character which should, according to the Unicode standard, solve the problem for numeric fractions in an elegant way. That would mean something like 1⁄2 in HTML. A program which is capable of presenting fractions two-dimensionally should do that, and otherwise the appearance should fall back to linear notation. But I'd be very surprised to see any current browser handle that the intended way, and many of them would fail to implement even the fallback part!

Just to demonstrate what the different approaches yield on your current browser with its current settings, here is a table of different presentations for 5/8:

Approach HTML notation Appearance
Linear notation 5/8 5/8
Special character ⅝ ¨ý
sup and sub ⁵/₈ 5/8
Fraction slash 5⁄8 5⁄8

FRACTION SLASH
mnemonic name(s): <//f>
HTML 4 mnemonic name:& frasl; (no space between & and f)

[tedster]

I tried a test with some text before and following the fraction. The results were much more appealing when I only use <sup> and let the denominator sit on the baseline.

<SUP> Only
Incidental re-sizing staff requirements through attrition can be accelerated by paridigm shifts and focusing on core suitability and cross-training. Conceptualizing random endpoints by ¹/100 in an access matrix provides reach extentions enterprise wide. Document-centric projections unfetter traditional auditing practices rivaling central process management. Advanced functionality, easy administration, proclaim the hallmarks of unprecedented opportunity.

<SUP> and <SUB>
Iteration systemwide engenders economies of scale, cross-media technology, presentation action items and life cycle replication. Respective divisions historically insignificant, upscale ¹/₁₀₀ of the trendlines in a management inventory analysis survivabilty format. Enterprise engenderment accelerates initiative platforms, reducing staffing components, integration of technical accessibility, resulting in bottom line pluralisms, benefit-wise.

However, making the font smaller for both numerator and denominator is a big help in getting a decent look.

(edited by: tedster at 11:56 pm (utc) on April 2, 2002)

[pageoneresults]

Now, if you take your example and add the Fraction Slash...

¹⁄₁₀₀

Yuck! Just goes to show you that using regular html might be the best way to go if you are using fractions outside of the default ones available.

Linear Notation: 1/100

Fraction Slash Only (no sup/sub): 1⁄100

Code for Fraction Slash is & # 8 2 6 0 ;
(no spaces inbetween)

[ggrot]

You could just use a gif.

[mikegram]

Since you're only asking about simple fractions, the mathematics on the site are probably not complex enough to bother with this. I don't know much about it but there's MathML. [w3.org...]