[therocket954]

I'm using @font-face to embed a font, but the custom font has a different scale than the system fonts it degrades to. For example:

Custom font at 25 px is about the same "size" as 12 px Arial.

The problem arises when an older browser doesn't support the custom font, it degrades to Arial, but still keeps the 25pt making the text much larger.

I'm wondering if there's a CSS trick for this, or if anyone can suggest a typography program that will allow me to change the aspect ratio / height size of a font file.

Thanks!

HTML Code:

@font-face {  
  font-family: "My Font";  
  src: url(../font/myfont.eot); /* IE */  
  src: local("My Font"), url(../font/myfont.ttf) format("truetype"); /* non-IE */  
	}

	
body {
	font-family: "My Font", Arial, sans-serif;
	font-size: 25px;
	}

[therocket954]

Fixed the issue... ended up just going with a different custom font that had a similar scale to Arial.

However, for future reference, I would still like to know if there's any font editing programs that could do such a thing.