Font stretching?

Discussion in 'HTML' started by Ole Streicher, Apr 16, 2008.

  1. Hi,

    is it possible with HTML to show a "stretched" font? I want a
    parenthesis "(" resp. ")" to have the full height of a table cell.

    See http://olebole.lima-city.de/aa.html for an example.

    Regards,

    Ole

    --
    If you think technology can solve your problems you don't understand
    technology and you don't understand your problems. (Bruce Schneier)
     
    Ole Streicher, Apr 16, 2008
    #1
    1. Advertising

  2. Ole Streicher wrote:
    > Hi,
    >
    > is it possible with HTML to show a "stretched" font? I want a
    > parenthesis "(" resp. ")" to have the full height of a table cell.
    >
    > See http://olebole.lima-city.de/aa.html for an example.
    >
    > Regards,
    >


    No not automatically. What you could do is make their font size X * the
    rows that they span, but it will make them bigger not stretched.

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="content-language" content="en-us">
    <title>template</title>

    <style type="text/css">
    /* set line height to consistant 1 for formulas */
    table.formula { border-collapse: collapse; line-height: 1; }

    /* set font size #x rows to span for parenthesis */
    td.span3 { font-size: 3em; }
    </style>
    </head>
    <body>
    <table class="formula">
    <tr><td></td><td rowspan="3" class="span3">(</td><td></td><td>A + b + c
    + d</td><td rowspan="3" class="span3">)</td></tr>
    <tr><td>x=exp</td><td>1-</td><td><hr></td></tr>
    <tr><td></td><td></td><td>D + e + f + g</td></tr>
    </table>
    </body>
    </html>


    Other option use images and stretch the height attribute. Then again
    this seems to be the case for MathML. Good luck with IE. Explains what
    so many site with formulas presented as images!

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Apr 16, 2008
    #2
    1. Advertising

  3. "Jonathan N. Little" <> writes:
    > No not automatically. What you could do is make their font size X *
    > the rows that they span, but it will make them bigger not stretched.


    This is what I do not know at the place. Is there really no way to
    override the "100 % means normal size" behaviour of sizing fonts to
    "100 % means full cell height"?

    > Other option use images and stretch the height attribute. Then again
    > this seems to be the case for MathML. Good luck with IE. Explains what
    > so many site with formulas presented as images!


    Yes. The problem is not only IE, but also Firefox: my one (2.0.xx)
    cannot print Mathml formulas, and it is much more difficult to
    fine-tune the output (I would not do this if mathml presentation in
    firefox would be perfect, but it is not).

    On the other hand, the infrastructure to build formulas with images is
    much more complicated since I usually need LaTeX & Co. Especially if I
    need to present on-the-fly generated formulas this would be a
    nightmare. And, one cannot cut-and-paste from the image. etc.pp.

    Regards,

    Ole

    --
    If you think technology can solve your problems you don't understand
    technology and you don't understand your problems. (Bruce Schneier)
     
    Ole Streicher, Apr 16, 2008
    #3
  4. Ole Streicher wrote:
    > "Jonathan N. Little" <> writes:
    >> No not automatically. What you could do is make their font size X *
    >> the rows that they span, but it will make them bigger not stretched.

    >
    > This is what I do not know at the place. Is there really no way to
    > override the "100 % means normal size" behaviour of sizing fonts to
    > "100 % means full cell height"?


    Not that I know of. Not sure which 100% you mean?

    "font-size: 100%" means just that 100% of the font size not a ratio with
    respect to width. "line-height: 1.5" is a ratio of the line to line
    spacing in terms of the font height. Again does not distort the glyph

    >
    >> Other option use images and stretch the height attribute. Then again
    >> this seems to be the case for MathML. Good luck with IE. Explains what
    >> so many site with formulas presented as images!

    >
    > Yes. The problem is not only IE, but also Firefox: my one (2.0.xx)
    > cannot print Mathml formulas, and it is much more difficult to
    > fine-tune the output (I would not do this if mathml presentation in
    > firefox would be perfect, but it is not).


    I have no problem SeaMonkey SeaMonkey 1.1.9 is is essentially Firefox 2.x

    http://xml-maiden.com/userjs/mathml/examples/xml/ham.xhtml

    Prints formulas just fine. Maybe you need the fonts...

    http://www.mozilla.org/projects/mathml/fonts/
    Fonts for MathML-enabled Mozilla

    > On the other hand, the infrastructure to build formulas with images is
    > much more complicated since I usually need LaTeX & Co. Especially if I
    > need to present on-the-fly generated formulas this would be a
    > nightmare. And, one cannot cut-and-paste from the image. etc.pp.


    Not sure what the "pp." is, but if you do you formulas in a word
    processor like Word

    http://math-editor.sourceforge.net/
    Mathematics and Drawing Toolbars for Microsoft Word: Home

    You can take a screenshot, crop, and save as image for your
    pages...seems to be what most sites do.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Apr 16, 2008
    #4
  5. Scripsit Ole Streicher:

    > Is there really no way to
    > override the "100 % means normal size" behaviour of sizing fonts to
    > "100 % means full cell height"?


    In CSS, no. Doing such things in JavaScript might be possible, but
    overkill.

    You don't really want to size fonts to the cell height. Rather, you want
    to parts of your mathematical expression to have matching sizes, which
    means, among other things, that parentheses may need to be several times
    larger than normal characters. This is manageable, though not easy and
    nice; see my
    "Math in HTML (and CSS)",
    especially section
    "Towards two-dimensionality",
    http://www.cs.tut.fi/~jkorpela/math/#twodim

    Beware that this is a font issue too: the characteristics of parentheses
    vary by font, and the differences become big when the font size gets
    big. You might even consider using a separate font for large parentheses
    for this reason.

    --
    Jukka K. Korpela ("Yucca")
    http://www.cs.tut.fi/~jkorpela/
     
    Jukka K. Korpela, Apr 16, 2008
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    1
    Views:
    1,320
  2. =?Utf-8?B?U3JpZGhhcg==?=

    stretching the background image instead of tiling

    =?Utf-8?B?U3JpZGhhcg==?=, Nov 23, 2005, in forum: ASP .Net
    Replies:
    3
    Views:
    8,255
    Mats Lycken
    Nov 30, 2005
  3. Arthur Dent

    Table stretching excessively in IE

    Arthur Dent, Mar 6, 2006, in forum: ASP .Net
    Replies:
    4
    Views:
    1,031
    slagomite
    Mar 7, 2006
  4. Lee Harris

    Image Stretching

    Lee Harris, Oct 27, 2003, in forum: HTML
    Replies:
    1
    Views:
    529
    David Graham
    Oct 27, 2003
  5. mttc
    Replies:
    2
    Views:
    2,462
    Roedy Green
    Jul 3, 2009
Loading...

Share This Page