At least one mysterious <i>l</i> or some other character
has to appear in any <s . . .>-block that has an
<img . . .>. Otherwise, the image is misaligned.
font-size:5mm
font-size:7mm
font-size:10mm
font-size:12mm
font-size:14mm
The CSS juju is
#stv {vertical-align:center; position:relative;
top:.02em;height:.03em; width:12em}
and here is the algorithm for font-size:7mm:
<![CDATA[
<div id=msm style=height:2.25em;font-size:7mm>
<u>
<s id=s4><u>l</u><img id=stv src=sqr.gif>l</s>
<s id=s2><i>l</i><img id=stv src=sqr.gif></s>
<s id=n0><i>l</i><img id=stv src=sqr.gif></s>
<s id=n2><i>l</i><img id=stv src=sqr.gif></s>
<s id=n4><i>l</i><img id=stv src=sqr.gif></s>
</u>
</div>
]]>(Now works on IE7and Foxfire, and the invisible
<i>l</i> is no longer a holy mystery.)
l