W3C home > Mailing lists > Public > www-math@w3.org > April 2002

way to implement msqrt

From: Jimmy Cerra <jimbofc@yahoo.com>
Date: Fri, 12 Apr 2002 23:45:21 -0400
To: <www-math@w3.org>
Message-ID: <000001c1e29d$a7004480$0100a8c0@locutus>
In my endeavors to create a JS-written MathML proc, I ran into the
problem of how to represent an msqrt element.  Because of the "perverse"
notation common to the element, I've been forced to concede that a table
works best for layout purposes.  (Wouldn't the world have been simpler
if everyone used 1/x exponents instead of x roots???)

Despite my adverse reaction I still wish to implement the element.
After a few hours of testing, I came to the example following this
message.  I used CSS and HTML-tables.  The colors & classes are purely
for diagnostics, so they will eventually be taken out/changed.  I used a
trick that I saw in the XSLT style sheet to get the "radical" part of
the square root.  Is there a better way; what possible problems could I
encounter using this approach?

Example file:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>raw-html square root test: Do or do not; there is no
try.</title>
	<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
	<style type="text/css">
	<!--
	div.test {background: #99F; margin: 1em; padding: 1em;
font-size: 100%;}

	.l1, .l2, .l3, .l4, .l6, .l7, .l8 {margin: 0; padding: 0;}
	.l1 {background: #F00;}
	.l2 {background: #FF0;}
	.l3 {background: #F0F; vertical-align: bottom;}
	.l4 {
		display: block;
		position: relative;
		top:  .18em;
		left: .14em;
		font-family: monospace;
		vertical-align: bottom;
		font-size: 120%;
	}
	.l6 {background: #FF9;}
	.l7 {background: #F9F;}
	.l8 {background: #F9F;}
	.l9 {
		background: #F66;
		border-top: .04em solid black;
		border-left: .04em solid black;
		margin: 0;
		padding: .1em .2em .1em .2em;
	}
	-->
	</style>
</head>
<body>
<div class="test">
<table cellspacing="0" cellpadding="0" class="l1">
	<tr class="l2">
		<td class="l3"><span class="l4">\</span></td>
		<td class="l6">
			<table cellspacing="0" cellpadding="0"
class="l7">
				<tr class="l8">
					<td
class="l9">-1<sup>3<sup>3<sup>3</sup></sup></sup><sub>3<sub>3<sub>3</sub
></sub></sub></td>
				</tr>
			</table>
		</td>
	</tr>
</table>
</div>
</body>
</html>



---
Jimmy Cerra
Received on Friday, 12 April 2002 23:45:29 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Saturday, 20 February 2010 06:12:51 GMT