#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Posts
    2
    Rep Power
    0

    CSS2 Embedded Font Resizing - Possible?


    I have a font I want to embed that works very well. The problem is that the font is about 1.5-2.0 times as large as the other default fonts like Arial, Verdana, Times. Is there any method I can use to "resize" this embedded font to force it to be 12px tall (12px is my body baseline and I use ems from there on out so I can resize on-the-fly with style sheets). My concern is that if a browser won't take the embedded font then there will be a huge differential between the embedded font "size" at 12px and the alternate font (Arial, Helvetica, Verdana) "size." I would expect a command like font-size to work within @font-face but it does not.

    I am enclosing an annotated screenshot that show the difference.

    @font-face {
    font-family: Beast Machines;
    font-style: normal;
    font-weight: normal;
    unicode-range: U+0-1F, U+10CF*;
    src: url(fonts\BEASTMA0.eot);
    }

    I also tried per the w3.org reference:

    units-per-em:2048;
    cap-height:1024;

    to the font-face definition in an attempt to shrink it by 50% but this did not work. Any suggestions would be appreciated.
    Attached Images
  2. #2
  3. Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2003
    Posts
    804
    Rep Power
    101
    Have you tried specifying the font-size when you use the font (such as with <font> tags), or will that not work... I have never used an embedded font before.
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Posts
    2
    Rep Power
    0
    Yes that kind of resizing works just fine. My issue is with the Relative size difference between the embedded font and the "normal" system fonts. So if I use the embedded font in headers and size it to look "good", then if for some reason a client that can't use embedded fonts views the page, the font they are viewing will look too small since the site would be optimized to look good with the embedded font, which for some reason displays about 150% larger.

    I am looking for some scaling to apply to the embedded font before it gets interpretted by any other CSS processing.
  6. #4
  7. Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Jun 2003
    Posts
    804
    Rep Power
    101
    Hmm... ok, I see your problem. Well, obviously it would be nice if there were a CSS style that you could apply to the embedded font... but if there does not seem to be any style to do that, I would try to find an application that would let you edit your font file and make it smaller.

IMN logo majestic logo threadwatch logo seochat tools logo