424,279 Members | 1,905 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,279 IT Pros & Developers. It's quick & easy.

Making radical expressions?

P: n/a
Is there a nice way to have HTML display mathematical expressions
that contain radical symbols (square root, cube root, ..., nth root)
that look nice.
The best I can come up with is by having a table, a CSS border, the
radical sign:

<TABLE>
<TR>
<TD>&radic</TD><TD style="border-top: 1pt solid black;">103</TD>
</TR>
</TABLE>

This seems kind of cruddy. Is there a better way to represent
mathematical expressions without having to make complex tables?

Thanks,

todd.
Jul 23 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
mo**@spamcop.net wrote:
Is there a nice way to have HTML display mathematical expressions
that contain radical symbols (square root, cube root, ..., nth root)
that look nice.
The best I can come up with is by having a table, a CSS border, the
radical sign:

<TABLE>
<TR>
<TD>&radic</TD><TD style="border-top: 1pt solid black;">103</TD>
</TR>
</TABLE>

This seems kind of cruddy. Is there a better way to represent
mathematical expressions without having to make complex tables?


Wait until MathML gets better browser support, and use an image in the
mean time. Or if you absolutely have to use pure HTML, slightly less
ugly markup is this, only with a class instead of inline CSS:

&radic;<span style="border-top:1px solid black;">103</span>
Jul 23 '05 #2

P: n/a
Leif K-Brooks wrote:
mo**@spamcop.net wrote:
Is there a nice way to have HTML display mathematical expressions
that contain radical symbols (square root, cube root, ..., nth root)
that look nice.
Wait until MathML gets better browser support,


MathML is supported just fine in Mozilla based browsers, and there is an
extension available for it in IE. However, to use it properly, the
document *should* be served with an XML mime type (application/xhtml+xml
or application/xml).

The problem is that to serve it as text/html to IE, since it does not
support XHTML properly, is in violation of the specifactions. The only
other option would be to serve it as application/xml, but then you need
to also provide the XSL stylesheet in order for IE to render it properly
as HTML. If you don't it just renders the XML pretty-print source tree.

Jacques Distler uses MathML in his blog [1]. He uses XHTML 1.1 + MathML
DTD. Though he incorrectly serves it as text/html to IE, but he does it
correctly for standards compliant browsers, so it's not too bad.
and use an image in the mean time.
The problem with images is that it may be difficult to provide adequate
alternate text for more complicated equations. Simple equations like
square root, you could write alt="√103" or alt="&radic;103", but it may
be harder for other kinds of equations and symbols, though Unicode
probably supports most of them that you'll need in the various
mathematical symbols and operators sections.
Or if you absolutely have to use pure HTML, slightly less ugly markup
is this, only with a class instead of inline CSS:
&radic;<span style="border-top:1px solid black;">103</span>


I think the image is a better alternative than that, but that text may
be suitable alt text for the image, as shown above.

[1] http://golem.ph.utexas.edu/~distler/blog/

--
Lachlan Hunt
http://lachy.id.au/
http://GetFirefox.com/ Rediscover the Web
http://SpreadFirefox.com/ Igniting the Web
Jul 23 '05 #3

P: n/a
On Fri, 19 Nov 2004 mo**@spamcop.net wrote:
Is there a nice way to have HTML display mathematical expressions
that contain radical symbols (square root, cube root, ..., nth root)
that look nice.
See http://www.unics.uni-hannover.de/nht...thematics.html
and http://www.cs.tut.fi/~jkorpela/math/ .
<TABLE>
<TR>
<TD>&radic</TD><TD style="border-top: 1pt solid black;">103</TD>
</TR>
</TABLE>


First, don't write &radic; but √ , which is better
supported among browsers (Netscape 4.x) and editors.

Second, don't attempt to make a horizontal bar but simply write
V(a+b)
where I used "V" to represent the square root sign.

Third, set the encoding (charset) to UTF-8.
http://ppewww.ph.gla.ac.uk/~flavell/...cklist.html#s6
If you want to make a fool of yourself, you could write &Ouml;
for the square root sign.
http://google.com/search?ie=ISO-8859...title:Stockton

--
http://www.unics.uni-hannover.de/nht...quareroot.html

Jul 23 '05 #4

P: n/a
Andreas Prilop <nh******@rrzn-user.uni-hannover.de> wrote:
Second, don't attempt to make a horizontal bar but simply write
V(a+b)
where I used "V" to represent the square root sign.


I'm not so sure about it - in some cases, a horizontal bar might improve
the appearance, as I discuss at
http://www.cs.tut.fi/~jkorpela/math/#uol

Note that using text-decoration: overline puts it a little lower than
using a top border. There's still the minor problem that the square root
sign does not connect with the overline. We can make the gap smaller, at
the risk of causing higher actual line height if this appears inside
running text:

<big>√</big><span style="text-decoration:overline">103</span>

On the other hand, there's the low-tech reliable approach of using
sqrt(103), though it's possible that some people won't recognize it but
would understand the root sign - but this can usually be handled by
giving an explanation - perhaps on the fly, by using
<a href="expl.html#sqrt" title="square root of">sqrt</a>(103)

But in a relatively mathematical text, I would try the root sign method,
with overline, though probably using parentheses as well if the radicand
contains any binary operators.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Jul 23 '05 #5

P: n/a
On Fri, 19 Nov 2004, Andreas Prilop wrote:
If you want to make a fool of yourself, you could write &Ouml;
for the square root sign.
http://google.com/search?ie=ISO-8859...title:Stockton


I suppose you're leaving it to me to point out that, at:

http://www.merlyn.demon.co.uk/www-use0.htm

Dr. John says:

Some pestilential authors override your default text and background
with undesirable choices of font, colour or pattern.
^^^^^^^^^^^^^^^^^^^^^^^^^^^

And sometimes Dr. John is right. Font changes are *not* the HTML way
of extending the character repertoire.

&Ouml; in HTML is definitively the O-umlaut/trema character. Any
browser which allows itself to be persuaded otherwise is in a state of
sin.
Jul 23 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.