CSS: how to have different sizes for each font

Question

I have a website the uses "arial narrow". To avoid compatibility problems I made a @font-face version of that font using "Font Squirrel" font-face generator (http://www.fontsquirrel.com), but when I'm on a system that doesn't have the native "Arial Narrow" and then it loads online via @font-face, the font is greater than the native "Arial Narrow"; I'm using absolute size in px for the fonts.

Is there a way to set different sizes for the native and online font?

@font-face {
font-family: 'ArialNarrow';
src: url('/fonts/arialn-webfont.eot');
src: local('☺'), url('/fonts/arialn-webfont.woff') format('woff'), url('/fonts/arialn-webfont.ttf') format('truetype'), url('/fonts/arialn-webfont.svg#webfontNZumFher') format('svg');
font-weight: normal;
font-style: normal; }

and below:

font-family: 'Arial Narrow', 'ArialNarrow', arial, helvetica, sans-serif;
font-size:14px;

Thanks in advance, sorry for my bad english

Answer 1

In theory, the CSS 2.0 and CSS 3 property font-size-adjust was created for that use, but its support is weak. No IE (surprise!), Fx 3.0+ and afaik no support in Saf 4 and no Op 10.5.

I wonder why both Arial Narrow aren't the same size (and have no answer) but I'd like to point out that Arial Narrow is licensed by Ascender to Microsoft and can be purchased here: http://www.fontslive.com/font/arial-narrow-regular.aspx (and this condensed family was created by Monotype).
For a non-commercial website http://en.wikipedia.org/wiki/Core_fonts_for_the_Web says that it's too late (2002) and that the packages should be kept in their original format and filenames: embedding modifies the former.

Answer 2

Sorry, similar questions have been asked and the conclusion was always "can't be done" (at least not reliably across browsers, kudos to @Felipe for bringing up those CSS properties - didn't know them).

It's difficult even using JavaScript, because it's damn difficult to find out which font has been actually used by the browser in the end.

See also: Get computed font-family in JavaScript