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 for an example.


    Ole Streicher, Apr 16, 2008
    1. Advertisements

  2. 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"
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="content-language" content="en-us">

    <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; }
    <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></td><td></td><td>D + e + f + g</td></tr>

    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!
    Jonathan N. Little, Apr 16, 2008
    1. Advertisements

  3. 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"?
    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.


    Ole Streicher, Apr 16, 2008
  4. 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
    I have no problem SeaMonkey SeaMonkey 1.1.9 is is essentially Firefox 2.x

    Prints formulas just fine. Maybe you need the fonts...
    Fonts for MathML-enabled Mozilla
    Not sure what the "pp." is, but if you do you formulas in a word
    processor like Word
    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.
    Jonathan N. Little, Apr 16, 2008
  5. Scripsit Ole Streicher:
    In CSS, no. Doing such things in JavaScript might be possible, but

    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",

    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, Apr 16, 2008
    1. Advertisements

Ask a Question

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

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.