Some types of equations
<![CDATA[
<xmp> - - - has been used for displayed
code, to make sure no typos have crept in.
Other comments for this appear below the tables.
]]>
<![CDATA[
</body><table border=1 cellpadding=1 cellspacing=0><tr>
<td id=lft width=50%>type 1:(50%)</td>
<td nowrap><table border=1 cellpadding=1 cellspacing=0><tr>
<td><br><br></td> <! set hgt>
<td>## = ####</td> <! the eqn>
</tr></table></td>
<td id=rgt width=50%>(50%)(1a)</td>
</tr></table><body> <! insane! - see notes>
]]>
<![CDATA[
(Watch out for poor alignment with <sup> and <sub>.)
</body><table border=1 cellpadding=1 cellspacing=0><tr>
<td id=lft width=50%>type 2:</td>
<td nowrap><table border=1 cellpadding=1 cellspacing=0><tr>
<td><br><br><br></td> <! set hgt>
<td>##</td> <! lhs>
<td>=</td> <! = >
<td>#</td> <! rhs>
<td>#<br>#</td>
<td>#<sup>#</sup></td>
<td>#<sub>#</sub></td>
</tr></table></td>
<td rowspan=1 id=rgt width=50%>(2a)</td>
</tr></table><body>
]]>
<![CDATA[
(This is safer.)
</body><table border=1 cellpadding=1 cellspacing=0><tr>
<td id=lft width=50%>type 2:</td>
<td nowrap><table border=1 cellpadding=1 cellspacing=0><tr>
<td><br><br><br></td> <! set hgt>
<td>##</td> <! lhs>
<td>=</td> <! = >
<td>#</td> <! rhs>
<td>#<br>#</td>
<td>#<a class=sp6 id=e1>#</a></td>
<td>#<a class=sb6 id=w1>#</a></td>
</tr></table></td>
<td id=rgt width=50%>(2b)</td>
</tr></table><body>
]]>
<![CDATA[
</body><table border=1 cellpadding=1 cellspacing=0><tr>
<td id=lft width=50%>type 3:</td>
<td nowrap><table border=1 cellpadding=1 cellspacing=0><tr>
<td><br><br></td> <! set hgt>
<td id=rgt>#</td>
<td>=</td>
<td id=lft>##</td>
<td id=lft>##</td>
</tr><tr>
<td><br><br></td> <! set hgt>
<td id=rgt>##</td>
<td>=</td>
<td id=lft colspan=2>###</td>
</tr></table></td>
<td id=rgt width=50%>(3)</td>
</tr></table><body>
]]>
| type 4: |
|
## |
= |
##### |
|
|
= |
## |
+ |
### |
|
| | |
+ |
##### |
|
(4) |
<![CDATA[
</body><table border=1 cellpadding=0 cellspacing=0><tr>
<td id=lft width=50%>type 4:</td>
<td nowrap><table border=1 cellpadding=1 cellspacing=0><tr>
<td><br><br></td> <! set hgt>
<td>##</td>
<td>=</td>
<td id=lft colspan=3>#####</td>
</tr><tr>
<td><br><br></td> <! set hgt>
<td></td>
<td>=</td>
<td>##</td>
<td>+</td>
<td id=lft>###</td>
</tr><tr>
<td><br></td> <! set hgt>
<td></td><td></td><td></td>
<td>+</td>
<td id=lft>#####</td>
</tr></table></td>
<td id=rgt width=50%>(4)</td>
</tr></table><body>
]]>
Naturally, there was the question of whether CSS boxes or
old-fashioned tables ought to be used to set equations. For now,
I am sticking with tables because they appear to be giving me better control
of horizontal and vertical alignment. That is not to say I am perfectly
satisfied with them, and I might get rid of the tables
if CSS boxes can be made to work better.
There were two relatively easy ways to do (note - equation - number) with
tables.
(1) Table-in-table: The essential structure is
<![CDATA[
</body><table width=100%><tr>
<td id=lft> ( text-align:left ) </td>
<td><table align=center><tr>
<td> ( often a string of td's ) </td>
</tr></table></td>
<td id=rgt> ( text-align:right ) </td>
</tr></table><body>
]]>
and the result is:
| ( text-align:left ) |
| ( often a string of td's ) |
|
( text-align:right ) |
(2)Push-and-shove: The essential structure is
<![CDATA[
</body><table><tr>
<td id=lft width=50%> ( push ) </td>
<td nowrap> ( often a string of td's ) </td>
<td id=rgt width=50%> ( shove ) </td>
</tr></table><body>
]]>
and the result is
| ( push ) |
( often a string of td's ) |
( shove ) |
The basic idea for the second style is here, at
mathrec.org.
The outer cells are each set to fill half of the viewport, and that causes
the table to center the inner cell and fill the viewport at the same time.
(Wish I had thought of that!) The identifiers, lft, rgt and ctr, are defined in
the stylesheet, eqns.css, and they set text-align:left, right and center.
Either way,
there is a problem with old browsers (Netscape 4) that don't pay attention
to white-space:nowrap. They can squeeze the equation into a column rather
than a row. The fixup, use <td nowrap> whenever it
matters, is easy and only a little bit irritating. In
<td nowrap> <table> the nowrap appears to be
inherited, and some of the examples use that.
One more ugly little bug: after a table with a specified width or a
table that contains a <td> with a specified width, Netscape 4 forgets what font
it was using, and it may forget other things too. The easy, but truly irritating
fixup there was to make every such table an out-of-body experience.
Here again are the ingredients: